2010-04-22 55 views
1

HTML的相關片段:這個例子中的多重選擇是如何工作的?

<span class="a"> 
<div class="fieldname">Question 1</div> 
<input type="text" value="" name="q1" /> 
</span> 

相關的jQuery:

$.each($('.a'), function(){ 
$thisField = $('.fieldname', $(this)); 
}); 

究竟被設置爲$thisField?如果我對jQuery中的多個選擇器的理解是正確的,那麼它應該抓取外部元素<span>和內部元素<div>。但由於某種原因,如果我使用$thisField.prepend("hi");,它會在文本Question 1之前放置hi,但不會在<div>之前。我想多個選擇會抓住這兩個元素,而prepend()增加hi到兩種元素的開始,而不僅僅是<div>

回答

2

您正在使用的調用約定不是「多重選擇器」,它實際上是在選擇器('.fieldname')的上下文($(this))內搜索的。 See docs

你能做到這一點,以獲得<div><span>

$(this).find('.fieldname').andSelf().prepend('hi'); 
1

$('.fieldname', $(this));相當於$(this).find('.fieldname');

沒有得到這個困惑的東西,如:$('.class1, class2');

$('.class1, class2');只有一個參數輸入。

+0

所以在$('。class1','.class2');和$('。class1',$(this));唯一的區別是使用$(this)作爲第二個方法,它是find()的簡寫,而不是多重選擇器?那是唯一的區別因素? – sepiroth 2010-04-22 08:35:29

0

「的.prepend()方法將指定的內容,每個元素的jQuery的集合中的第一個孩子」 http://api.jquery.com/prepend/

由於您在具有「a」類的元素中使用類「fieldname」的所有元素,所以輸出是正確的。

0

但由於某些原因,如果我用 $thisField.prepend("hi");它結束了 文本 Question 1前右把喜,但不<div>之前。

你試過這個嗎?

$.each($('.a'), function(){ 
    $('hi').insertBefore($('.fieldname', $(this))); 
}); 
0

我不知道你的意思有多個選擇,使我看到你做的只是選擇<div class="fieldname">。所有.prepend正在做的是在div的內容之前加入hi

所以,在這裏你不會選擇多個元素。

0

選擇器內部有多個選擇器字符串 ..

這樣

$multiple= $('.fieldname, a'); 
// this will select all <a> elements and all elements with class 'fieldname' 
0
$.each($('.a') 

手段「爲具有類= A的每個元素」(在這種情況下,只有你的跨度),因此,如果您的div也有類=一個,然後你會看到你預期的結果。

相關問題