使用具有元素ID的onkeyup函数从Html获取值到jquery?

时间:2018-06-18 07:11:03

标签: javascript jquery html

因为我正在尝试使用onkeyup函数获取从html到jquery的值,以便通过ID获取按键数据我试过但我无法在警报中获取值我不知道我的代码中有什么错误。任何人都可以帮助我。

这是我的代码:

$(document).ready(function() {
    $('#test').keypress(function() {
      var value = document.getElementById('test').value;
      alert("value",value);
	});
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<input id="test" type="text">

5 个答案:

答案 0 :(得分:3)

你的逻辑是正确的。问题是因为当alert()只接受一个参数时,你会提供两个参数。

除此之外,您应该使用console.log进行调试,并且可以使用事件处理程序中的this关键字来访问触发事件的元素。试试这个:

&#13;
&#13;
$(document).ready(function() {
  $('#test').keypress(function() {
    var value = $(this).val();
    console.log("value", value);
  });
})
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="test" type="text">
&#13;
&#13;
&#13;

另请注意,keyupinput可能是更合适的事件,因为keypress会在将新密钥添加到元素值之前触发。

答案 1 :(得分:2)

删除

alert("value", value);逗号并添加alert("value : " + value);

$('#test').keypress(function() {
  var value = document.getElementById('test').value;
  alert("value :"+ value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<input id="test" type="text">

答案 2 :(得分:0)

试试这个..

<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>$(document).ready(
      function() {
          $('#test').keypress(

          function() {
            var values = document.getElementById('test').value;
            alert("value"+values);
          });
      })</script>
</head>
<body>
<input id="test" type="text" value="2">
</body>
</html>

答案 3 :(得分:0)

使用keyup并修改警告,如下所示:

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
  $(document).ready(
    function() {
      $('#test').keyup(

        function() {
          var value = document.getElementById('test').value;
          alert(value);
        });
    })

</script>


<input id="test" type="text">

在您的代码中,事件在按键上触发,因此它采用旧值。因此,在空输入字段的情况下,它将警告空值,但是在键盘的情况下,它将警告用户已经填充的值。

使用keyup进行演示:http://jsfiddle.net/lotusgodkk/GCu2D/4020/

使用按键进行演示:http://jsfiddle.net/lotusgodkk/GCu2D/4023/

答案 4 :(得分:0)

不要将javascript与jquery混合,你只需要$(this).val()来获取值,使用keyup()

$(document).ready(function() {
    $('#test').keyup(function() {
      var _value = $(this).val();
      alert("value " + _value);
	});
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<input id="test" type="text">