Question

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

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

$(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 2

使用：

$('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 3

试试这个

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

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

Answer 4

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

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

Answer 5

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

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

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

使用jQuery查找元素值

5 个答案: