Jquery .on ('click' ) 仅触发一次然后停止

Question

我在这里和谷歌上搜索了一个解决方案，但没有成功，有很多类似的帖子，但大多数人不使用 .on() 或缺少 end }); 等

如标题所示，我正在使用 .on('click') ，它只会调用该函数一次，然后停止，如果我使用 .click() 它可以工作正如预期的那样!我已经检查过控制台，它也告诉我同样的情况。

我正在使用 jQuery 1.9.1 和 jQuery-ui 1.10.3，并在 Chrome 中进行测试。下面的代码(我从函数中省略了一些代码并缩短了一些，因为我知道这并不重要)；

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>

Jquery:

$('#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，获取数据并将其放置到下一个“屏幕”上，然后显示下一个“屏幕”。有一个后退按钮，可以清除所述屏幕并隐藏它，然后再次显示类别列表。

当类别列表取消隐藏时，无论点击多少次都不会触发该功能!

有什么想法可以解决吗？

Answer 1

我无法用你的代码真正测试它，但是如果我省略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;
});