3

我在 PHP 中有一个在 ajax 上工作的登录表单，当我单击登录按钮时它工作得很好，但在按下回车键时却没有。

我对此进行了大量研究，并尝试了该网站上发布的所有相同解决方案，并尝试了所有解决方案，但没有什么对我有用。

我的 HTML 包含在 div id ="mini-login" 中

<div class="content-login">
<h4>Email Address:</h4>
<input type="text" name="email" value="" />
<h4>Password:</h4>
<input type="password" name="password" value="" id="pasword"/>
<br />
<a href="<?php echo $forgotten; ?>"><?php echo $text_forgotten; ?></a><br />
<br />
 <input type="button" value="<?php echo $button_login; ?>" id="button-login-mini" class="button" />

还有我的剧本——

$('#button-login-mini').live('click', function() {
$.ajax({
url: 'index.php?route=module/login/validate',
type: 'post',
data: $('#mini-login .content-login :input'),
dataType: 'json',
beforeSend: function() {
  $('#button-login-mini').attr('disabled', true);
  $('#button-login-mini').after('<span class="wait">Please wait</span>');
},  
complete: function() {
  $('#button-login-mini').attr('disabled', false);
  $('.wait').remove();
},        
success: function(json) {
  $('.warning, .error').remove();
  if (json['redirect']) {
    $('#mini-login .content-login').fadeOut('slow');
    location = json['redirect'];
  } else if (json['error']) {
    $('#mini-login .content-login').prepend('<div class="warning" style="display: none;">' + json['error']['warning'] + '</div>');

    $('.warning').fadeIn('slow');
  }
},
error: function(xhr, ajaxOptions, thrownError) {
  alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
}); 
});

所以上面的工作非常好，但我尝试在输入键上调用它 - keyup、keydown、keypress 并检查 keyCode==13，但它不起作用，也尝试使用表单，现在对此发疯了！ ！！我究竟做错了什么？？以及如何使它工作？

注意：登录页面不是一个完整的文档，点击主页上的登录链接会向下滑动。

这就是登录页面的调用方式-

$(document).ready(function() {
$('#mini-login > .heading-login a').live('click', function() {
    $('#mini-login').addClass('active');

    $('#mini-login').load('index.php?route=module/login #mini-login > *');

    $('#mini-login').live('mouseleave', function() {
        $(this).removeClass('active');
    });
});
});
4

4 回答 4

2

尝试这个

 $(document).ready(function() {
$('#mini-login > .heading-login a').live('click', function() {

 $(document).bind('keydown', function(e){         
    if (e.which == 13){
       $('#button-login-mini').trigger('click');   
   }     
      });


$('#mini-login').addClass('active');

$('#mini-login').load('index.php?route=module/login #mini-login > *');

$('#mini-login').live('mouseleave', function() {
    $(this).removeClass('active');
    $(document).unbind('keydown');
});
});
});
于 2013-03-25T05:41:58.153 回答
1

用于trigger在按下回车时触发点击事件....

尝试这个

  $(document).keypress(function(event){  // i called a clicked event in document here you can chnage it to any other event like.. input field keyup event or so....
   var keycode = (event.keyCode ? event.keyCode : event.which);
   if(keycode == '13'){
     $('#button-login-mini').trigger('click');   
   }

});

并使用on()而不是现场

$(document).on('click', '#button-login-mini',function() {....

最接近的静态父级比 on.... 的文档更受欢迎。在你的情况下，#content-login我认为

于 2013-03-25T05:40:14.710 回答
1

这是我与 jQuery 一起使用的代码片段

            $(".login").keyup(function(event){
                if(event.keyCode == 13){
                    $("#loginBtn").click();
                }
            });

keyCode 13 = 输入键#loginBtn是我附加到调用 th onClick 的按钮本身的 ID，.login它只是它所在的 div 类。

希望这可以帮助

于 2013-03-25T05:38:06.520 回答
0

当您在电子邮件文本框或密码文本框中按 Enter 键时，您实际上可以调用该事件：

将您的 ajax 代码放在一个函数上并在您的事件中调用它：

function login(){
    $.ajax({
    url: 'index.php?route=module/login/validate',
    type: 'post',
    data: $('#mini-login .content-login :input'),
    dataType: 'json',
    beforeSend: function() {
      $('#button-login-mini').attr('disabled', true);
      $('#button-login-mini').after('<span class="wait">Please wait</span>');
    },  
    complete: function() {
      $('#button-login-mini').attr('disabled', false);
      $('.wait').remove();
    },        
    success: function(json) {
      $('.warning, .error').remove();
      if (json['redirect']) {
        $('#mini-login .content-login').fadeOut('slow');
        location = json['redirect'];
      } else if (json['error']) {
        $('#mini-login .content-login').prepend('<div class="warning" style="display: none;">' + json['error']['warning'] + '</div>');

        $('.warning').fadeIn('slow');
      }
    },
    error: function(xhr, ajaxOptions, thrownError) {
      alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
    }
    }); 
}

$document.ready(function(){
$('#button-login-mini').on('click', function() {
  login();
});
$('input[name="email"],input[name="password"]').bind('keypress',function(e){
    var code = (e.keyCode ? e.keyCode : e.which);
    if(code == 13) {
      login();
    }
  });
});
于 2013-03-25T06:07:37.143 回答