使用jQuery獲得下列值的最快方法

我似乎很難理解這些jQuery選擇器的工作方式。使用jQuery獲得下列值的最快方法

假設你有這種HTML

<form> 
    <input type="hidden" name="something" value="1" class="class_name" /> 

    <div> 
     <input class="blur_function" name="email" /> 
    </div> 
</form>

及以下的jQuery

$(document).ready(function(){ 

    $('.blur_function').live('blur',function(){ 

     // get the value of the hidden input above 
     var something = $(this).prev('.class_name').val(); 

    }); 

});

，直到遇到我可以想象這個 '下一頁（'。CLASS_NAME'）將在代碼向上遍歷有class =「class_name」的東西，但是我最終得到了undefined，因爲它只在其內部的元素內部遍歷。

所以我需要做這樣的事情父DIV外面和前.class_name的範圍內得到：

var something = $(this).parent().prev('.class_name').val();

有一個更快的方法來做到這一點使用相同的HTML結構？

來源

2011-09-14 willdanceforfun

爲什麼不乾脆$（ 'CLASS_NAME'）。VAL（） – c0deNinja

可能有多個.class_name在網頁上的 – willdanceforfun

我會建議：

var something = $('.class_name', $(this).closest('form')).val();

選擇全部是直接孩子的投入：

var something = $('> .class_name', $(this).closest('form')).val();

只選擇第一.class_name是形式的直接子：

var something = $('> .class_name:first', $(this).closest('form')).val();

jsFiddle demo

來源

2011-09-14 06:47:55 Teneff

這就是幻想。我不知道它爲什麼工作，雖然..是不是在逗號選擇器應該讓它選擇2個對象？ – willdanceforfun

@cosmicbdog實際上逗號在選擇器之後，將2個參數傳遞給jQuery函數 – Teneff

這意味着它正在尋找'$（this）.closest（'form'）*範圍內的'.class_name''。。另一個可能有助於解釋的例子是：以下兩個是相同的$（'＃example .class_name'）'和'$（'。class_name'，'#example'）' –

您的用例並不是特別常見的用例。在很多情況下，你真正想要的東西可以在祖先/後代框架中定義。我懷疑你的實際用例也符合這個標準。

這是偶然事件，您的.class_name元素碰巧是一個祖先的兄弟姐妹。如果您的HTML因佈局而略有變化，則可能不再是這種情況。什麼是重要的是您的.class_name元素與.blur_function共享相同的祖先form。

鑑於此，這裏是我的建議：

$('.blur_function') 
    .closest('form') 
    .find('.class_name') 
     .val()

希望這有助於！

來源

2011-09-14 06:51:22 jimbojw

非常感謝。 – willdanceforfun

爲什麼不根據其名稱選擇它？

var someValue = $('input[name="something"]').val();

來源

2011-09-14 06:57:45 Ali

這將是理想的（直接選擇它），但可能會有多種形式並輸入[name =「something」]。 – willdanceforfun

使用jQuery獲得下列值的最快方法

回答

相關問題