Jquery和输入文本onchange显示弹出

Jquery and input text onchange show pop up

本文关键字：显示 onchange 文本 输入 Jquery      更新时间：2023-09-26

我花了太多时间试图让一个简单的jquery和输入框示例发挥作用。

当有人在输入框中输入完内容时，我希望jquery弹出一个警报。最终我会用它做更多的代码，但现在我只想让它工作起来！

下面是我的例子，它似乎不起作用：

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('#selector').change(function () {
    alert($('#selector').val());
});
</script>
</head>
<body>
<input type="text" id="selector">
</body>
</html>

有什么想法吗？

将jquery封装在document.ready()中，如图所示：

<script type="text/javascript">
$(document).ready(function(){
  $('#selector').change(function () {
    alert($('#selector').val());
  });
});
</script>

在此处阅读有关document.ready()的更多信息。

编辑：-如果您想提醒"有人完成键入（如您的问题中所示）"，则使用.focusout()事件，如图所示：

  <script type="text/javascript">
  $(document).ready(function(){
    $('#selector').focusout(function () {
     alert($('#selector').val());
    });
  });
  </script>

演示

添加文档就绪。

$(function(){
   $('#selector').change(function () {
     alert($('#selector').val());
   });
});
</script>

您必须使用.focusout

$('#selector').focusout(function () {
alert($('#selector').val());
});

工作示例http://jsfiddle.net/2w7gyjgy/

您需要将代码放入文档就绪处理程序-中

<script type="text/javascript">
    $(document).ready(function() {
       $('#selector').change(function () {
          alert($('#selector').val());
       });
    });
</script>

在页面上的脚本中使用Document.ready

$(document).ready(function(){// apply this
 $('#selector').change(function () {
    alert($('#selector').val());
 });
});
相关文章：