javascript - 使用 jQuery 查找元素值

Question

在下面的 HTML 标记中，如何module_id[]通过单击 span class 来获取具有 name 的输入字段的值.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 示例 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 数据属性。

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