0

これは動的に作成されたフィルターリストです。[アカウント]リンクをクリックすると、アカウント名のリストを含むモーダルウィンドウが開きます。アカウント名をクリックすると、li要素がフィルターのサイドバーに表示されます。問題は、現時点でリンクを複数回クリックして、同じ情報であっても要素を作成できることです。私がそれをする必要があるのは、アカウントリストごとに一度だけliを作成することです。not（）セレクターを使用し、アカウント名がクリックされたときのアクションの最後にクラスを追加することを考えました。問題は、それらがすべて同じクラスの.accountを共有していることです。これは、JQueryがクリック時にアクションを実行する方法です。私の質問は、最初に、not（）行が起動しないため、これをどのように機能させるかです。第二に、アカウントのクラスのすべてのリンクではなく、ユーザーがクリックした1つのアイテムのみをターゲットにするにはどうすればよいですか？これはJSFiddleですが、サイトのBootstrapからのコードがたくさんあるため、何らかの理由で完全に機能したくありません。http://jsfiddle.net/rsxavior/puhdE/7/

これは私が参照している関連コードです：

<li>
    <a href="#accountModal" data-toggle="modal">Accounts</a>
    <!--Start Account Sort Modal-->
    <div class="modal hide" id="accountModal" tabindex="-1" role="dialog" aria-labelledby="accountLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <hgroup>
                <h4 id="accountLabel">Accounts</h4>
                <h6>(Choose an account's first letter to quickly sort)</h6>
            </hgroup>
            <ul class="nav nav-pills">
                <li><a href="#">A</a></li>
                <li><a href="#">B</a></li>
                <li><a href="#">C</a></li>
                <li><a href="#">D</a></li>
                <li><a href="#">E</a></li>
                <li><a href="#">F</a></li>
                <li><a href="#">G</a></li>
                <li><a href="#">H</a></li>
                <li><a href="#">I</a></li>
                <li><a href="#">J</a></li>
                <li><a href="#">K</a></li>
                <li><a href="#">L</a></li>
                <li><a href="#">M</a></li>
                <li><a href="#">N</a></li>
                <li><a href="#">O</a></li>
                <li><a href="#">P</a></li>
                <li><a href="#">Q</a></li>
                <li><a href="#">R</a></li>
                <li><a href="#">S</a></li>
                <li><a href="#">T</a></li>
                <li><a href="#">U</a></li>
                <li><a href="#">V</a></li>
                <li><a href="#">W</a></li>
                <li><a href="#">X</a></li>
                <li><a href="#">Y</a></li>
                <li><a href="#">Z</a></li>
            </ul>
        </div>
        <div class="modal-body">
            <ul>
                <li class="account"><a href="#">All</a></li>
                <li class="account"><a href="#">A Name</a></li>
                <li class="account"><a href="#">Another Account Name</a></li>
                <li class="account"><a href="#">Babcock Center</a></li>
            </ul> 
        </div>
        <div class="modal-footer">
            <ul class="pager">
                <li><a href="#">Prev</a></li>
                <li><a href="#">Next</a></li>
            </ul>
        </div>
    </div>
    <ul class="account-hidden-li"></ul>
</li>

そしてそれに伴うJQuery：

$('.account:not('.selected-account')').click(function () {
    $('.account-hidden-li').append('<li class="account-select">Sample Account Name<a class="close" data-dismiss="alert" href="#">&times;</a></li>');
    $('.account').addClass('selected_account');
)};

この件での助けをいただければ幸いです。

4

1 に答える 1

2 
$(".account").click(function () {
this.unbind("click");
    $('.account-hidden-li').append('<li class="account-select">Sample Account Name<a class="close" data-dismiss="alert" href="#">&times;</a></li>');
    $('.account').addClass('selected_account');

}）;

于 2012-09-17T13:34:22.493 に答える