0

特定のクラスのすべての秒要素に対してクリックイベントをバインドしたいのですが、使用しています。

$("ul.message-list-row > li:eq(1) > div").click(function(){...});

残念ながら機能しません。また、>"なしで同じことを試しましたが、うまくいきませんでした。

私のコードには 7 つの同一の UL があります。そう、

console.log($("ul.message-list-row").length);

7 を返しますが、

console.log($("ul.message-list-row > li:eq(1)").length);

1 を返します。7 であってはいけませんか? 間違いは何ですか？

ちなみに、次のマークアップで試しています。

<ul class="message-list-row rounded-corners">
    <li>
        <img src="Public/CSS/Images/sample-app-icon-02.png" alt="" title="" />
        <span class="app-name">AppName</span>
        <span class="version">V3.1</span>
        <div class="apple">OS V. - 5.04</div>
    </li>
    <li>
        <div>
            <span>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</span>
        </div>
    </li>
    <li>
        <div class="progress-bar" title="70"></div>
        <span>%70</span>
    </li>
    <li class="number">7643</li>
    <li class="completed">&nbsp;</li>
    <li>&nbsp;</li>
    <li>
        <ul>
            <li>Language:</li>
            <li>
                <img src="Public/CSS/Images/flag-uk.png" alt="" title="" />
                English
            </li>

            <li>Operator:</li>
            <li>Operator</li>

            <li>Country:</li>
            <li>
                <img src="Public/CSS/Images/flag-tr.png" alt="" title="" />
                Country
            </li>

            <li>Badge:</li>
            <li>Clean</li>
        </ul>
    </li>
</ul>


<ul class="message-list-row rounded-corners">
    <li>
        <img src="Public/CSS/Images/sample-app-icon-03.png" alt="" title="" />
        <span class="app-name">AppName</span>
        <span class="version">V3.1</span>
        <div class="apple">OS V. - 5.04</div>
    </li>
    <li>
        <div>
            <span>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nulla vitae elit libero, a pharetra augue. Maecenas sed diam eget risus varius blandit sit amet non magna.</span>
        </div>
    <li>
        <div class="progress-bar" title="0"></div>
        <span>%0</span>
    </li>
    <li class="date">00:22:58</li>
    <li class="waiting">&nbsp;</li>
    <li>
        <a class="settings-button" href=""></a>
        <a class="approve-button action-button" href=""></a>
        <a class="cancel-button action-button" href=""></a>
    </li>
    <li>
        <ul>
            <li>Language:</li>
            <li>
                <img src="Public/CSS/Images/flag-uk.png" alt="" title="" />
                English
            </li>

            <li>Operator:</li>
            <li>Operator</li>

            <li>Country:</li>
            <li>
                <img src="Public/CSS/Images/flag-tr.png" alt="" title="" />
                Country
            </li>

            <li>Badge:</li>
            <li>Clean</li>
        </ul>
    </li>
</ul>
4

1 に答える 1

1

:eq()あなたが思っているようには機能しません。:nth-child(2)の代わりに使用し:eq(1)ます。

:nth-childセレクターは、その親の n 番目の子である jQuery セット内のすべての要素を取得します。セレクターは:eq、jQuery セット内の 1 つの要素、「n 番目」(0 から始まる) 要素のみを取得します。

http://jsfiddle.net/mattball/xhYaP/

于 2012-08-16T04:10:45.153 に答える