0

在JQuery 的文档中，"parent > child"选择器选择由“父”指定的元素的“子”指定的所有直接子元素。“直接孩子”只是向下一级的元素。例如，我有这个代码：

    ...
    <table class="advanceSearch">
      <tr>
        <td>
          <ul class="form">
            <li>
              <label>Document Type:</label>
              <input type="text" id="cmbDocumentType" name="paramtitle" />
            </li>
            <li>
              <label>Title:</label>
              <input type="text" id="paramtitle" name="paramtitle" />
            </li>
            <li>
              <label>Notes:</label>
              <input type="text" id="paramNotes" name="paramNotes" />
            </li>
            <li>
              <label>Revision Number:</label>
              <input type="text" id="paramRevisionNumber" name="paramRevisionNumber" />
            </li>
            <li>
              <label>Draft Number:</label>
              <input type="text" id="paramDraftNumber" name="paramDraftNumber" />
            </li>
            <li>
              <label>Version Number:</label>
              <input type="text" id="paramVersionNumber" name="paramVersionNumber" />
            ...

我想选择inputid 以“param”开头的元素，所以我使用了find()而不是parent > child选择器：

      $("table.advanceSearch").find("ul.form").find('input[id^="param"]').attr("disabled", "disabled");

这很好用，但我发现有两个find()选择器是多余的。有什么办法可以简写这个吗？

4

3 回答 3

4

您实际上根本不需要.find()；您可以改用两个后代选择器。

$('table.advanceSearch ul.form input[id^="param"]')

请记住：（x > y子选择器）或多或少可以与 互换$('x').children('y')，并且$('x y')或多或少可以与 互换$('x').find('y')。

于 2012-05-08T03:55:41.063 回答
1

试试这个：

$('table.advanceSearch ul.form input[id^="param"]').prop('disabled', true);

或者

$('table.advanceSearch ul.form').find('input[id^="param"]').prop('disabled', true);

或者

$('table.advanceSearch ul.form li').children('input[id^="param"]').prop('disabled', true);
于 2012-05-08T03:56:33.617 回答
1

您的选择器可以更长：

$(".advanceSearch input[id^='param']").prop("disabled", true);

这将做同样的事情，没有冗长。

于 2012-05-08T03:59:26.477 回答