2011-04-24 67 views
0

我想附加一個onChange回調到div #dim下的所有輸入元素。它選擇了所有3個輸入元素,但返回異常:jQuery設置回撥子元素

Uncaught TypeError: Object 0 has no method 'change' 

這可能是因爲x可能不是一個jQuery對象。我將如何完成這項工作?

function registercb() { 
    var sel = $("div.dim > input"); 
    for (x in sel) { 
     x.change(function() { 
      dosomething(); 
     }); 
    } 
} 

回答

1

你可以簡單地做:

function registercb() { 
    $("div.dim > input").change(dosomething);    
} 

幾個看點:

  • 內部的迭代(不使用這個,看到下一個點)x是DOM元素,而不是具有.change()方法的jQuery對象,您需要將它包裝在像$(x)這樣的jQuery對象中,但是這不是公司的直接解決方案在這裏。
  • 不要使用for(...in...)循環來迭代一個對象(一個jQuery對象是陣列狀),即類型的循環是用於枚舉
  • 大多數jQuery函數(差不多都是)運行在多個元素上,所以只需在集合上運行它即可影響所有元素,.change()就是其中之一。
  • 在情況下,你需要循環,檢查.each(),因爲它會讓你的生活變得更輕鬆,不使用此這裏,這只是它會是什麼樣子的例子:

例子:

function registercb() { 
    $("div.dim > input").each(function() { 
     $(this).change(dosomething);    
    }); 
} 
+0

哇!很好的答案..謝謝你的額外知識.. – bsr 2011-04-24 13:30:47

0

假設你'dim'div有一個ID,而不是一類的dim,你可以簡單地這樣做:

$("#dim > input").change(function() { dosomething(); }); 

Working example

在你你指的.dim代碼是指#dim,而文本 - #選擇通過ID和.選擇按類別,所以如果你的DIV的格式爲<div id="dim">那麼你不會找到任何匹配的元素與div.dim作爲您的選擇。

1

您不必遍歷元素。您可以將jQuery對象看作持有集合。當你這樣做:

var sel = $("div.dim > input"); 

這意味着sel有它的所有投入要素,這樣的話,當你運行像變化的方法(),它會影響到所有集合中的元素。因此,你可以做這樣的事情:

function registercb() { 
    $("div.dim > input").change(function(){ 
    dosomething(); 
    }); 
} 

獎勵知識:現在你的問題是,當你在做for(x in sel)你是jQuery對象本身,你不希望在得到很多東西。如果您在Chrome中運行下面的代碼,你會看到它輸出了很多意想不到的東西:

for(x in sel){ 
    console.log(x); 
} 

相反的jQuery有each,讓你遍歷所有的事情,你想:

sel.each(function(index, item){ 
    console.log(item); 
}); 

你可以甚至在其他事情上使用它,這真的很方便!

$([1,2,3]).each(function(index item){ 
    console.log(item); // 1,2,3 
})