Question

我对Javascript / jQuery很新，所以请耐心等待。

我在这里设置了一个JSFiddle：JSFiddle

正如您在评论中看到的，在下一栏中找到div的几次尝试都失败了。

代码在这里：

<table>
<tr id="testtr">
    <td id="fail">
        <select class="part_number" id="part_select_from_blanks" name="part_number">
            <option value="">Select a Part</option>
            <option desc="Dr. Orion Dickinson" value="32">Alice Wyman</option>
            <option desc="Fabiola Harvey" value="31">Camryn Tillman</option>
        </select>
    </td>
    <td id="fail2">
        <div id="desc_from_blank2" class="testclass">test</div>
    </td>
</tr>

和Javascript在这里：

$('.part_number').change(function () {
    var sel = $("option:selected", this);
    var desc = sel.attr('desc');
    alert(desc);
    //alert($('.part_number option:selected').attr('desc'));

    // This one finds the div correctly
    alert($('#desc_from_blank2').attr('id'));

    // This one only finds the div if I remove the <table> from html
    alert($(this).next().attr('id'));

    // this one never finds the div
    alert($(this).next("div").attr('id'));

    // This one never finds the div
    alert($(this).next().find('.testclass').html());

    // This works when I delete <table> from html, but not with <table>
    $(this).next().html(desc);
    alert($(this).next().html());
});

Answer 1

使用它，

alert($(this).closest("td").next().find('.testclass').html());

因为testclass位于另一个td中。因此，您需要先获取父级，然后选择next()，这将获得下一个td。然后你就可以找到div。

Demo

Answer 2

不会这样做吗？

alert($('.testclass').html());

Answer 3

alert($(this).closest('td').next().find('.testclass').html());

Answer 4

您没有正确选择正确的元素。您可以这样做（假设每行只有一个select和testclass结果字段：

alert(
    $(this)               // select
      .closest('tr')      // parent table row
      .find('.testclass') // search for the div with testclass class
      .html()             // get the HTML contents
      .trim()             // remove any unnecessary whitespace from either end
);

如果每行有多个，则可以执行此操作：

$(this).closest('td').next().find('.testclass').html().trim();

Answer 5

next()找到元素的下一个兄弟。 http://api.jquery.com/next/

因此，当您使用$(this)时，您要告诉您搜索与您的.testClass元素具有相同父级的元素。没有符合您要求的元素。您需要使用parent()或closest()向上移动树，以找到所需的元素。

Answer 6

我怀疑您要使用closest方法查找包含触发更改事件的td元素的select，然后从那里使用next()得到第二列。像这样：

var secondTd = $(this).closest('td').next();

JQuery没有找到td

6 个答案: