每个()jQuery中的Change()

时间:2013-02-16 12:07:23

标签: jquery event-handling

管理此类情况的最佳方法是什么:

$('.element').each(function() {

    $sibling = // find a sibling to $this.
    $mainElement = $(this); // memorize $(this)
    $sibling.change(function() {
       // when sibling changes
       // do something using $mainElement
       // problem is, $mainElement is not the element you think
       // $mainElement is the last .element found....
    })
});

一个解决方案就是一个表...但是,将change()嵌套在each()中没有任何优势......

我的html示例:

<div id="first">
  <span class="element"></span>
  <input name="first" type="text" />
</div>
<div id="second">
  <span class="element"></span>
  <input name="second" type="text" />
</div>

在这个例子中,例如$sibling = $(this).next('input');

4 个答案:

答案 0 :(得分:5)

一种方法是使用closure。这将捕获 $mainElement中的变量,可以说,使用其当前值。

$('.element').each(function() {

    $sibling = // find a sibling to $this.
    $mainElement = $(this); // memorize $(this)
    $sibling.change(function($mainElement) {
        return function() {
            // use $mainElement
        }
    }($mainElement))
});

jsfiddle example(请务必在编辑后模糊文本字段,否则.change()将无法触发)

答案 1 :(得分:1)

$('.element .sibling').each(function( ind, el) {

    $parent = $( el ).closest( '.element' );
    $( el ).change(function() {
         $parent.doSomething();
    });

});

答案 2 :(得分:1)

试试这个

$('.element').each(function() {
    $(this).siblings('.sibling').change(function() {
       var mainElement = $(this).siblings('.element');
        // Play here
    });
});

答案 3 :(得分:0)

我要说的最简单的赌注是在兄弟姐妹身上使用.each,然后为兄弟姐妹找到相对的“.element”。当然取决于您的代码。否则,这样的事情可能会起作用,即使由于.each:

而感觉有点多余
$('.element').each(function() {
    $(this).siblings('.sibling').change(function() {
        var mainElement = $(this).siblings('.element');
        // Do whatever you want here...
    });
});