使用jQuery查找元素值

Question

在以下HTML标记中，如何通过单击跨度类.click来获取名称为module_id[]的输入字段的值。

HTML：

<div class="module"> 
    <div class="info">..</div> 
    <div class="ctrl"><span class="click">Click</span></div> 
    <input type="hidden" value="module1" name="module_id[]" /> 
    <input type="hidden" value="title" name="module_title[]" /> 
</div> 

我已经试过这样：

的jQuery：

$('.module').on('click','.click',function(){ 
    var target_module = $(this).parent(); 
    var module_id = target_module.find('input[name=module_id\\[\\]]').val(); 

    alert(module_id); 

}); 

演示： http://jsfiddle.net/FKdNJ/

Answer 1

有了：

$('input[name="module_id[]"').val(); 

jsFiddle example 1

$('.module').on('click', '.click', function() { 
    console.log($('input[name="module_id[]"').val()); 
}); 

如果你有一组以上的代码块中，使用$(this).closest('.ctrl').next().val()：

为：

$('.module').on('click', '.click', function() { 
    console.log($(this).closest('.ctrl').next().val()); 
}); 

jsFiddle example 2

Answer 2

试试这个

$('.module').on('click','.click',function(){ 
    alert($(this).closest('.module').find('[name="module_id[]"]:first').val()) 
}); 

http://jsfiddle.net/FKdNJ/3/

Answer 3

$(this).parent();是给你的，而不是<div class="ctrl">。

您可以使用$(this).parent().parent()，但更灵活的解决方案是使用closest()代替;

$(this).closest('.module'); 

你可以在这里看到这个工作; http://jsfiddle.net/FKdNJ/5/

---

FWIW，你也可以彻底改变你的方法，并使用e.delegateTarget检索.module元素直接（http://jsfiddle.net/FKdNJ/7/）;

$('.module').on('click','.click',function(e){ 
    var target_module = $(e.delegateTarget); 
    var module_id = target_module.find('input[name=module_id\\[\\]]').val(); 

    alert(module_id); 
}); 

Answer 4

我在小提琴增加了一个答案：

$('.click').on('click',function(){ 
    alert($('input[name=module_id\\[\\]]').val()); 
}) 

http://jsfiddle.net/FKdNJ/6/

Answer 5

尝试this。如果可能的话，最好使用html 5数据属性。

$('span.click').click(function(){  
    var moduleId = $(this).closest("div.module").find("input[name='module_id[]']").val() 
    alert(moduleId); 
});