Jquery在父级之外查找id或窗体

Jquery find id or form outside parent

本文关键字：查找 id 窗体 Jquery      更新时间：2023-09-26

如何在父id之外找到id或表单？

例如：

<ul>
    <li>
        <a></a>
    </li>
</ul>
<div>
    <div>
        <div>
            <div>
                <form></form>
            </div>
        </div>
    </div>
</div>

单击a href时，如何使用jQuery获取表单信息？还是只有当我给表格一个类或id时，这才可能？

单击a可以获得form引用，如下所示。

$('a').click(function(e) {
    e.preventDefault();
    var form = $(this).closest('ul').next('div').find('form');
})

我建议您为整个代码段提供一个包装器

<div id="wrapper">
<ul>
    <li>
        <a class="link"></a>
    </li>
</ul>
<div>
    <div>
        <div>
            <div>
                <form></form>
            </div>
        </div>
    </div>
</div>
</div>

然后，使用

$("a.link").click(function(e){
  e.preventDefault();
var form = $(this).parents('#wrapper').find('form'); // the required form
})

使用find遍历它。

<ul>
    <li>
        <a id="find" style="border:1px solid lawngreen;">Find</a>
    </li>
</ul>
<div>
    <div>
        <div>
            <div>
                <form>Form Text</form>
            </div>
        </div>
    </div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
  
  $("#find").click(function(){
  
    $("body").find("form").css({"color": "red", "border": "2px solid red"});
});
  
  });
  
</script>

您可以使用jQuery .closest方法。

这里有一个例子：

$('.btn').click(function(){
  var formParent = $(this).closest('form');
});

var form = $(this).closest('ul').siblings('div').find('form');

.siblings（）

描述：获取匹配元素集中每个元素的同级元素，可选地通过选择器进行筛选。

注：

假设ul有一个同级div

相关文章：