javascript - 如何在jquery中一起使用parent()和sibling()

Question

我有一个像这样的 2 个 div：

<div class="content">
    <label>First Name</label>
    <input name="firstName" id="firstName" type="text"  class="input firstName" />
</div>

<div class="footer">
    <button type="button" value="edit" id="Esubmit" class="button">Save</button>
</div>

使用 jQuery 的强大功能parent()和sibling()在单击“保存”按钮时如何获取“名字”的值。

我试过这个但它不起作用：

$('#Esubmit').click(function () {
    var first = $(this).parent().siblings('.content > input#firstName').eq(0);
    alert(first.val());
});

我知道你可以说

var first = $('#firstName').val();

但是我需要与兄弟姐妹和父母一起做这件事有一个特定的原因。

Answer 1

You following code

$('#Esubmit').click(function () {
    var first = $(this).parent().siblings('.content').children('input#firstName');// by parent and sibling
    alert(first.val());
});

reference siblings

Answer 2

您将过滤器选择器作为 的参数传递.siblings()，而不是完整的选择器。利用：

var first = $(this).parent().siblings('.content').children('input#firstName');

Answer 3

在问题中使用您的 DOM 结构，您可以使用以下 jQuery 函数字符串引用 firstName：

$(this).parent().siblings('.content').children('#firstName').val()

Answer 4

尝试这样的事情

            $('#Esubmit').click(function () 
            {
                var first = $(this).parent().prev().find('input#firstName');
                alert(first.val());
            });