2

私はここで検索し、無駄な解決策をグーグルで検索しましたが、同様の投稿がたくさんありますが、ほとんどの人は使用していない.on()か、 end を欠いている人});などです

タイトルのように、私が使用.on('click')していて、関数を一度だけ呼び出してから停止します。使用する.click()と、期待どおりに機能します! コンソールにチェックインしましたが、同じことがわかります。

私はjQuery-ui 1.10.3でjQuery 1.9.1を使用しており、クロムでテストしています。以下のコード (関数から一部のコードを省略し、重要ではないことがわかっているため、一部を短縮しました);

html:

<section id="Cat_List">
    <ul> 
        <li><a href="?C=44834">Cat 1</a></li>
        <li><a href="?C=10908">Cat 2</a></li>
        <li><a href="?C=58202">Cat 3</a></li>
        <li><a href="?C=73689">Cat 4</a></li>
    </ul>        
</section>

Jクエリ:

$('#Cat_list ul').on('click', 'li a', function (e) {
    e.preventDefault();
    var href = this.href.split('?C=').pop();
    $('.loading').center('fixed').show();
    console.log(href[1]);
    $.ajax({
        url: Script,
        type: "POST",
        data: {
            Function: 'Cat',
            Cat: href[1]
        },
        cache: false,
        success: function (Data) {
            console.log(Data);
            /*Place data on second page*/
            $('#Cat_List').hide(500, function () {
                $('#Category_con').show(500);
            });
        }
    });
    return false;
});

私も次のように変更しようとしました：

$(document).on('click','#Cat_List ul li a',function(e) {...

運がない！

機能の説明: ご覧のとおり、UL でクリックされたリンクのカテゴリ ID を取得し、データを取得して次の「画面」に配置し、次の「画面」を表示します。上記の画面をクリアして非表示にし、カテゴリリストを再度表示する戻るボタンがあります。

カテゴリ リストが非表示にされていない場合、クリックしても関数が起動しません。

解決方法はありますか？

4

3 に答える 3

2

コードで実際にテストすることはできませんが、ajax を省略して正しい ID を使用すると (JS (Cat_List) で大文字の L を使用した場合)、正常に動作します。こちらを参照してください: http://jsfiddle.net/ 6ZVBt/

<section id="Cat_list">
    <ul>
        <li><a href="?C=44834">Cat 1</a>

        </li>
        <li><a href="?C=10908">Cat 2</a>

        </li>
        <li><a href="?C=58202">Cat 3</a>

        </li>
        <li><a href="?C=73689">Cat 4</a>

        </li>
    </ul>
</section>
<section id="next_page">Next Page</section>

そしてJS：

$('#Cat_list ul').on('click', 'li a', function (e) {
    e.preventDefault();
    var href = this.href.split('?C=').pop();
    console.log(href[1]);

    $('#Cat_list').hide(500, function () {
        $('#next_page').show(500);
    });
    return false;
});
$(document).on('click', '#next_page', function (e) {
    e.preventDefault();
    $('#next_page').hide(500, function () {
        $('#Cat_list').show(500);
    });
    return false;
});
于 2013-05-21T15:28:14.830 に答える