JQuery выбрать только первый

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>

Я хотел бы выбрать первый TR, который имеет класс select.Я пробовал

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);

Так как есть : сначала и сначала () .

Чтобы выбрать все это, что вы используете:

$(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>

(Примечание: это не правильные имена идентификаторов, они не могут начинаться с цифры, если вам нужен валидный html)

Answer 3

Вы можете использовать функцию first () для этого.

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

Answer 4

Как насчет использования индекса?

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

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