2015-08-28 1 views
1

Я wriiten JQuery и HTML CSS, как показано ниже строк кодаПроблема в JQuery При нажатии на кнопку ОК

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 

    $(function() { 
     resetTimer(); 
     document.onkeypress = resetTimer; 
     document.onmouseover = resetTimer; 

     function logout() { 
      var t1 = setTimeout(reallyLogout, 60000); 
      $(".popup-form").css("display", "block"); 
     } 
     var t; 
     function resetTimer() { 
      clearTimeout(t); 
      t = setTimeout(logout, 60000); // Logout in 10 minutes 
     } 
     function reallyLogout() { 
      debugger 
      $(".popup-form").css("display", "none"); 
      location.href = '../login/login.aspx'; 
     } 
     function cancel() { 
      clearTimeout(t1); 
      resetTimer(); 
      $(".popup-form").css("display", "none"); 
     } 
    }); 

</script> 

<style type="text/css"> 
    .popup-form { 
    display:inline-block; 
    padding:40px; 
    background-color:white; 
    border:1px solid black; 
    position:fixed; 
    left:40%; 
    top:35%; 
    display:none; 
    z-index:99999999999999999; 
    } 
</style> 

<body> 
<div class="popup-form"> 
    <div class="popup-inner-form"> 
    <h4>Confirm</h4> 
     You will be logged out after 60 seconds 
     <input id="okbtn" value="Ok" type="submit" onclick="return reallyLogout();" /> 
     <input id="cancelbtn" value="Cancel" type="submit" onclick="return cancel();" /> 
    </div> 
</div> 
</body> 

Я создавал индивидуальные формы ... , который отображается, когда пользователь будет простаивать в течение 60 секунд , На самом деле наша основная цель заключается в том, что через 60 секунд отображается всплывающее окно. Если пользователь не будет нажимать какую-либо кнопку (ok/cancel), она должна быть перенаправлена ​​на страницу входа. Теперь проблема заключается в том, что при отображении всплывающего окна и нажатии кнопки ok она не перенаправляет его на страницу входа в систему ... Пожалуйста, помогите мне разобраться в проблеме в коде !!!

+1

почему у вас 'OnClick = "возвращение reallyLogout();" и' OnClick = "возвращение отмены();" 'вы не должны удалить' return' и только функции? – Samuel

+0

если вы удалите возврат, он будет работать. почему изначально, когда документ загружен, он вызывает resetTimer(), откуда он достигает setTimeout (logout, 60000). По истечении заданного времени я выйду на выход. В Logout снова вы установитеTimeout(), оттуда он указывает на reallyLogout(). Чтобы избежать этих циклов, просто используйте $ («# Custom-ID»). Click (function() {требуемый код для выполнения при нажатии;}); – suresh

+1

Вы не можете получить доступ к функции, созданной внутри документа, готового снаружи. если вы хотите вызвать функцию извне, то эта функция должна определяться глобально - это один из вариантов. проверьте эту ссылку http://stackoverflow.com/questions/2379529/how-to-call-a-function-within-document-ready-from-outside-it – kiruba

ответ

1

Прежде всего, так как вы используете мгновенно запущенную функцию, вы должны пройти jQuery в качестве параметра для того, чтобы быть активным в функции объем.

(function ($) { ->})(jQuery);

Вы должны приложить события OnClick внутри мгновенной области видимости функции в порядке доступа к функциям, как reallyLogout, так как вы не имеете доступа к функциям вне мгновенного объема вызова функции, потому что это выполняется только один раз в этой области ..

t1 должен быть объявлен в глобальной области видимости функции, так что вы можете восстановить его из любой точки в пределах любого вложенного вызова функции var t1;

Вот рабочий пример .. Я сделал то время 4 секунды

(function ($) { 
 
     resetTimer(); 
 
     var t1; // set this in global scope 
 
     document.onkeypress = resetTimer; 
 
     document.onmouseover = resetTimer; 
 

 
     function logout() { 
 
      t1 = setTimeout(reallyLogout, 4000); 
 
      $(".popup-form").css("display", "block"); 
 
     } 
 
     var t; 
 
     function resetTimer() { 
 
      clearTimeout(t); 
 
      t = setTimeout(logout, 4000); // Logout in 10 minutes 
 
     } 
 
     function reallyLogout() { 
 
      // debugger 
 
      console.log($(".popup-form")); 
 
      $(".popup-form").css("display", "none"); 
 
      location.href = '../login/login.aspx'; 
 
     } 
 
     function cancel() { 
 
      clearTimeout(t1); 
 
      resetTimer(); 
 
      $(".popup-form").css("display", "none"); 
 
     } 
 
     
 
     $("#okbtn").click(function(){reallyLogout();}); 
 
     $("#cancelbtn").click(function(){cancel();}); 
 
    })(jQuery);
.popup-form { 
 
    display:inline-block; 
 
    padding:10px; 
 
    background-color:white; 
 
    border:1px solid black; 
 
    position:fixed; 
 
    left:10%; 
 
    top:35%; 
 
    display:none; 
 
    z-index:99999999999999999; 
 
    }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<body> 
 
<div class="popup-form"> 
 
    <div class="popup-inner-form"> 
 
    <h4>Confirm</h4> 
 
     You will be logged out after 60 seconds 
 
     <input id="okbtn" value="Ok" type="submit" /> 
 
     <input id="cancelbtn" value="Cancel" type="submit" /> 
 
    </div> 
 
</div> 
 
</body>

+0

Спасибо за помощь ... Всплывающее окно не отображается –

+0

подождите 4 секунды, он покажет чуваку – KAD

-1

Попробуйте использовать

<input type="button"> 

вместо

<input type="submit"> 
0

Когда ваш скрипт работает, элементы DOM не загружаются. Смените позицию скрипта как раз перед этим.

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
 

 

 
<style type="text/css"> 
 
    .popup-form { 
 
    display:inline-block; 
 
    padding:40px; 
 
    background-color:white; 
 
    border:1px solid black; 
 
    position:fixed; 
 
    left:40%; 
 
    top:35%; 
 
    display:none; 
 
    z-index:99999999999999999; 
 
    } 
 
</style> 
 

 
<body> 
 
<div class="popup-form"> 
 
    <div class="popup-inner-form"> 
 
    <h4>Confirm</h4> 
 
     You will be logged out after 60 seconds 
 
     <input id="okbtn" value="Ok" type="submit" onclick="return reallyLogout();" /> 
 
     <input id="cancelbtn" value="Cancel" type="submit" onclick="return cancel();" /> 
 
    </div> 
 
</div> 
 

 
<script type="text/javascript"> 
 

 
    // your script 
 

 
</script> 
 

 
</body>

0

Удалить возвращение в OnClick = "возвращение reallyLogout();" & & onclick = "return cancel();" а также вырезать trueLogout() & & cancel() реализация и вставка вне $ (function() {});

Если вы используете $ ("# okbtn"). Click (function() {}); то вы можете использовать его внутри $ (function() {}); а также в этом случае удалить функцию onclick в HTML.

Если вы следуете своей структуре с помощью минутных изменений, объявите функцию глобальной как $ (function() {}); i.e reallyLogout = function() {// выполняемая операция //};

0

Вы должны добавить скобки, следующими способами:

t = setTimeout(logout(), 60000); // Logout in 10 minutes 

var t1 = setTimeout(reallyLogout(), 60000); 

Затем он будет работать. Кроме того, я тестировал.

1

Использовать функцию, которая определена внутри документа, готового из блока. создайте функцию, которая требуется для доступа из глобальной сети. см. ниже фрагменты кода. i изменен reallyLogout и Отменить выполняет функции, необходимые для доступа извне.

JS:

$(function() { 
    resetTimer(); 
    document.onkeypress = resetTimer; 
    document.onmouseover = resetTimer; 
    var t1; 
    function logout() { 
     t1 = setTimeout(reallyLogout, 60000); 
     $(".popup-form").css("display", "block"); 
    } 
    var t; 
    function resetTimer() { 
     clearTimeout(t); 
     t = setTimeout(logout, 60000); // Logout in 10 minutes 
    } 

    //declared the reallyLogout as a global function 
    reallyLogout= function() { 

     debugger 
     $(".popup-form").css("display", "none"); 
     location.href = '../login/login.aspx'; 
    }; 
    cancel= function() { 
     clearTimeout(t1); 
     resetTimer(); 
     $(".popup-form").css("display", "none"); 
    } 


}); 
Смежные вопросы