Question

今晚我尝试在用户在表单字段中输入文本时实现Ajax调用。

不幸的是，我使用jQuery和onChange事件来捕获文本，但这不起作用。单击文本输入时，它可以正常工作。这很奇怪，因为它与onBlur事件非常相似。

有什么想法吗？

这是我的HTML：

<form class="search" id="search" name="search">
  <div class="row">
   <div class="input-field inline col s4">
     <i class="material-icons prefix">keyboard</i>
     <input id="matrix" name="matrix" type="text" class="validate">
     <label for="matrix">Matrix</label>
   </div>
  </div>

这是我的jQuery代码：

$("#matrix").on('change', function(){ alert('hi') });

Answer 1

如果你想写活动，是这样的：

＆＃13;

//$("#matrix").on('change', function(){ alert('hi') });

$('form#search input[name=matrix]').bind('keypress', function(e) {
    alert('enter');
    return false;
});

＆＃13;

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <script src="https://code.jquery.com/jquery-3.1.0.js"></script>
  <title>JS Bin</title>
  <script src="https://code.jquery.com/jquery-1.11.3.js"></script>
</head>
<body>
  
  <form class="search" id="search" name="search">
  <div class="row">
   <div class="input-field inline col s4">
     <i class="material-icons prefix">keyboard</i>
     <input id="matrix" name="matrix" type="text" class="validate">
     <label for="matrix">Matrix</label>
   </div>
  </div>
  
</body>
</html>

＆＃13;

Answer 2

提醒您，如果您想获取搜索输入值，您必须添加e.key，因为$（'＃matrix'）。val（）不会捕获您刚刚按下的当前键。

$('form#search input[name=matrix]').bind('keypress', function(e) {

                     console.log(e)

                     // must add current key value e.key
                     var _search_for = $('#matrix').val() + e.key;

                    console.log(_search_for);

}）;

Answer 3

bind keypress效果不佳，我有一个更好的keyup功能解决方案。

请使用此键代替按键。我为我工作。

    $("#matrix").keyup(function(){


            var _search_for = $('#matrix').val();


 });

具体化和jquery事件onChange

3 个答案: