如何实现平变化的 使用jQuery?(How do I implement onchange

2019-07-18 11:31发布

<select>有此API。 关于什么<input>

Answer 1:

您可以使用.change()

$('input[name=myInput]').change(function() { ... });

然而,这一事件将仅当选择已经失去焦点,所以你需要点击其他地方有这样的工作。

如果这对你是不完全正确,你可以使用一些其他的jQuery的事件像KEYUP , KEYDOWN或按键 -这取决于你想要的确切效果。



Answer 2:

作为@pimvdb在他的评论中说,

需要注意的是变化,当输入要素已失去焦点才会触发。 还有,只要没有它的文本框的更新需要失去焦点的时候触发输入事件。 与关键事件,也适用于粘贴/拖动文本。

(见文档 )。

这是非常有用,这是值得把它在一个答案。 目前(V1.8 *?)有jQuery中FN没有。输入()便利,所以做事情是这样的

$('input.myTextInput').on('input',function(e){
 alert('Changed!')
});


Answer 3:

我会建议使用keyup事件类似下面:

$('elementName').keyup(function() {
 alert("Key up detected");
});

有达到相同的结果,所以我想这是降低到偏爱,并取决于你想如何准确工作的一些方法。

更新:这只适用于手动输入无法复制和粘贴。

对于复制和粘贴我想提出以下建议:

$('elementName').on('input',function(e){
 // Code here
});


Answer 4:

下面是我使用的代码:

$("#tbSearch").on('change keyup paste', function () {
    ApplyFilter();
});

function ApplyFilter() {
    var searchString = $("#tbSearch").val();
    //  ... etc...
}

<input type="text" id="tbSearch" name="tbSearch" />

这个工程相当不错,尤其是当与配对jqGrid控制。 你可以只输入到一个文本框,并立即查看您的结果jqGrid



Answer 5:

一个且只有一个可靠的方式做到这一点 ,它是通过在间隔拉的价值,并将其与一个缓存值。

之所以这样,是唯一的办法,是因为有多种方式使用各种输入(键盘,鼠标,粘贴,浏览器历史记录,voiceinput等)来更改输入字段,并在交叉使用标准的事件,你永远无法检测到所有的人-browser环境。

幸运的是,由于在jQuery的事件基础设施,它很容易添加自己的inputchange事件。 我这样做是在这里:

$.event.special.inputchange = {
    setup: function() {
        var self = this, val;
        $.data(this, 'timer', window.setInterval(function() {
            val = self.value;
            if ( $.data( self, 'cache') != val ) {
                $.data( self, 'cache', val );
                $( self ).trigger( 'inputchange' );
            }
        }, 20));
    },
    teardown: function() {
        window.clearInterval( $.data(this, 'timer') );
    },
    add: function() {
        $.data(this, 'cache', this.value);
    }
};

使用它像: $('input').on('inputchange', function() { console.log(this.value) });

有一个演示在这里: http://jsfiddle.net/LGAWY/

如果你害怕在多个间隔,可以绑定/解除绑定在该事件focus / blur



Answer 6:

<input id="item123" class="firstName" type="text" value="Hello there" data-someattr="CoolExample" />

$(".firstName").on('change keyup paste', function () {
   var element = $(this);
   console.log(element);
   var dataAttribute = $(element).attr("data-someattr");
   console.log("someattr: " + dataAttribute );
});

我建议用this关键字,以获得访问整个元素,以便你能做到,你需要与此元素的一切。



Answer 7:

$("input").keyup(function () {
    alert("Changed!");
});


Answer 8:

下面的工作,即使它是动态/ Ajax调用。

脚本:

jQuery('body').on('keyup','input.addressCls',function(){
  console.log('working');
});

HTML,

<input class="addressCls" type="text" name="address" value="" required/>

我希望这方面的工作代码将帮助别人谁是试图动态访问/ Ajax调用...



Answer 9:

你可以简单地用ID的工作原理

$("#your_id").on("change",function() {
    alert(this.value);
});


Answer 10:

$("input").change(function () {
    alert("Changed!");
});


Answer 11:

这为我工作。 如果点击与名字FIELDA场或任意键进入它更新字段ID fieldB。

jQuery("input[name='fieldA']").on("input", function() {
    jQuery('#fieldB').val(jQuery(this).val());
});


Answer 12:

你可以使用.keypress()

例如,考虑HTML:

<form>
  <fieldset>
    <input id="target" type="text" value="Hello there" />
  </fieldset>
</form>
<div id="other">
  Trigger the handler
</div>

事件处理程序可以绑定到输入字段:

$("#target").keypress(function() {
  alert("Handler for .keypress() called.");
});

我完全同意安迪; 一切都取决于你如何想它的工作。



Answer 13:

您可以以不同的方式做到这一点,KEYUP就是其中之一。 但是我给下面的变化的例子。

$('input[name="vat_id"]').on('change', function() {
    if($(this).val().length == 0) {
        alert('Input field is empty');
    }
});

NB: 输入[名称=“VAT_ID”]与你的输入ID名称替换。



文章来源: How do I implement onchange of with jQuery?