jquery - 根据已通过另一个输入字段更新更新的输入触发更改

Question

我有一个可以由另一个输入字段更新的输入字段，我试图在发生这种情况时发生一些事情，css 更改等等。我找不到触发它的好方法。

我用一个简化的例子设置了一个 jsfiddle。

这个想法是，当表单 1 中的字段发生更改时，会在表单 2 上触发警报。

http://jsfiddle.net/8KKHK/

HTML 代码：

<h3>form 1</h3>
<div id="form1">
  <input type="text" data-pair="1">
  <input type="text" data-pair="2">
  <input type="text" data-pair="3">    
</div><!--#form1-->

<h3>form 2</h3>
<div id="form2">
  <input type="text" data-pair="1">
  <input type="text" data-pair="2">
  <input type="text" data-pair="3">    
</div><!--#form1-->

Javascript代码：

jQuery('input').bind("change keyup input",function(){
    var d = jQuery(this).attr("data-pair");
    var value = jQuery(this).val();
    jQuery('input[data-pair="'+d+'"]').val(value);
});

jQuery('#form2 input').change("change keyup input",function(){
    var d = jQuery(this).attr("data-pair");
    alert(d);           
});

Answer 1

使用自定义事件（change.myown在我的示例中）：

jQuery('input').bind("change keyup input",function(e){
                var d = jQuery(this).attr("data-pair");
                
                var value = jQuery(this).val();
                var pair=jQuery('input[data-pair="'+d+'"]');
                pair.val(value);
                pair.trigger('changed.myown',e);
                }); 



jQuery('#form2 input').bind("changed.myown",function(e,orig_event){
console.log(orig_event);
var d = jQuery(this).attr("data-pair");
alert(d);
                
});​