用jQuery查找元素值

Question

在以下HTML标记中，如何通过单击span类.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

$(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示例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示例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

试试这个 。 如果可能的话，最好使用html 5 data-attribute。

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