检测按钮单击时值更改的文本框值的变化

Detect change in textbox value whose value changes on button click

本文关键字：文本 变化 按钮 单击 检测      更新时间：2023-09-26

我有以下一段代码：

$(".select").click(function(){
  $("input").val($(this).text()).change();
});
$("input").change(function(){
  alert($(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text">
<button class="select">1</button>
<button class="select">2</button>
<button class="select">3</button>
<button class="select">4</button>

在这里，当我通过单击<button>选择相同的值时，.change()函数无论如何都会被触发，这使得它与任何其他函数没有什么不同，即破坏了仅在值变化时触发的专用化。

SO上也存在类似的问题，但它没有给出这个问题的任何答案。

如何解决这个问题？

这就是

不传递处理程序.change()方法触发change事件的作用。应比较这些值并有条件地触发事件。

以编程方式更改输入的值时，不会触发 change 事件。因此，当您手动触发事件（通过使用 change 方法）时，您应该在触发事件之前自己检查值。

添加if语句，它将根据您的需要工作

$(".select").click(function(){
if($("input").val() != $(this).text())
  $("input").val($(this).text()).change();
});
$("input").change(function(){
  alert($(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text">
<button class="select">1</button>
<button class="select">2</button>
<button class="select">3</button>
<button class="select">4</button>

相关文章：