Question

我是否需要执行任何特殊操作来捕获通过jquery添加到dom的元素的click事件，

我将以下内容添加到dom中：

$('.dvPagerCities > .pagination > ul > li > a').addClass("pageCities")

通过chrome将html显示在

中

<a class="pageCities">»</a>

但是当我尝试捕捉点击事件时，不会显示警告。

<script>
    $(function () {
        $('.pageCities').click(function () {
            alert('City click detected');
            return false;
        });
    });
</script>

--------------更新---------------

<script>
    $('.dvPagerCities > .pagination > ul > li > a').addClass("pageCities")
    $(function () {
        $(".getCities").click(function () {
            var city = $(this).text();
            $.ajax({
                url: '@Url.Action("pvDisplayListOfWeatherCities", "Weather")',
                type: 'GET',
                data: { id: $(this).attr("dataCountry")},
                dataType: 'html',
                success: function (result) {
                    //alert('Country click detected'),
                    $('Title').text('Cities in ' + city),
                    $('#dvFullPage').remove();
                    $('#dvPartial').html(result);
                },
                error: function () {
                    alert("error");
                }
            });
            return false;
        });
    });


</script>
<script>
    $(function () {
        $('.dvPagerCities').on('click', '.pageCities', function () {

            alert('City click detected');
            return false;
        });
    });
</script>

---------------- HTML添加--------------

<div class="dvPagerCities">
<div class="pagination">
<ul>
<li class="PagedList-skipToPrevious">
<a href="/Weather/Index/Australia?p=1" class="pageCities">«</a>
</li>
<li class="disabled PagedList-pageCountAndLocation">
<a class="pageCities">Page 2 of 2.</a>
</li>
<li class="disabled PagedList-skipToNext">
<a class="pageCities">»</a>
</li>
</ul>
</div>
</div>

-----------------额外信息------------------

好的，如果我点击链接并转到天气页面，然后点击国家/地区并显示该国家/地区的城市列表并尝试页面没有任何反应，我会获得整页刷新。

但如果我再次点击页面链接，我会收到警报。

为什么在第一个城市出现时没有上课，并且在检测到点击之前进行了整页更新

Answer 1

如果<script>在之前执行，则会添加.pageCities类，.click方法无需查找，也不会绑定任何内容。确保先添加.pageCities，或使用事件委派：

$(".dvPagerCities").on('click', '.pageCities', function () {

在jQuery添加的类上捕获click事件

1 个答案: