Question

我的javascript

            $(".controls").click(function(event) {

                  var div = $(event.target).parents(".controls");

                  var a = $(div).find("tr .select");


            return false;
        });

和html

 <div id="grid1" class="controls">

    <a href="/projekt/create">Add</a>
    <a href="/projekt/edit">Edit</a>

</div>


<div id="grid2" class="controls">

    <a href="/uloha/create">Add</a>
    <a href="/uloha/edit">Edit</a>

    <table>
    <tr id="1"></tr>
    <tr id="2" class="select"></tr>
    <tr id="3"></tr>

    </table>

</div>

我想选择第一个具有类select的TR。我试过了

var a = $(div).find("tr:first .select");

或

var a = $(div).find("tr .select:first");

但他们都没有工作。

Answer 1

我很确定你想要的是这个：

var a = $(div).find("tr.select:first");

在jQuery选择器中，空格分隔层次结构中的级别。

如果我使用了选择器"tr:first .select"，它会查看第一个tr并返回所有具有select类的子项。

如果我使用了选择器"tr .select:first"，它会查找每个tr并返回第一个子元素和每个tr的选择类。

Answer 2

你可以试试这个：

var a = $("tr.select", div).first();

或

var a = $("tr.select:first", div);

由于:first和first()。

要在您使用的内容中选择所有这些：

$(this, that)

这样的事情会起作用吗？

$(".controls").click(function(event) {
    var a = $("tr.select:first", ".controls");
    // do stuff with a....
    return false;
});

当你按下按钮时，这会改变“两个”，但不会改为“四个”。

<div class="controls">
    <input type="button" value="Click the control" />
</div>
<div id="grid2" class="controls">
    <table>
        <tr id="1"><td>one</td></tr>
        <tr id="2" class="select"><td>two</td></tr>
        <tr id="3"><td>three</td></tr>
        <tr id="4" class="select"><td>four</td></tr>
    </table>
</div>
<script type="text/javascript">
    $(".controls input").click(function(event) {
        var a = $("tr.select:first", ".controls");
        $(a).text("okay");
        return false;
    });
</script>

（作为旁注，那些不是正确的id名称，如果你想要valide html，它们不能以数字开头）

Answer 3

使用索引怎么样？

var a = $(div).find("tr.select")[0]

/* I think that's the right syntax */

Answer 4

您可以使用first（）函数来执行此操作。

var a = $(div).find("tr.select").first();

jQuery只选择第一个

4 个答案: