2

jquery経由でDOMに追加された要素のクリックイベントをキャッチするために何か特別なことをする必要がありますか?

dom に以下を追加します。

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

クロムを介して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>

------------------追加情報------------------

リンクをクリックして天気予報のページに移動し、国をクリックしてその国の都市のリストを表示しても何も起こらず、ページ全体が更新されます。

しかし、ページのリンクをもう一度クリックすると、アラートが表示されます。

都市が最初に表示され、クリックが検出される前にページ全体が更新されたときにクラスが取得されないのはなぜですか

4

1 に答える 1

7

クラスが追加される前に<script>実行すると、メソッドは何も見つけることができず、何にもバインドされません。それが最初に追加されていることを確認するか、イベント委任を使用してください。.pageCities.click.pageCities

$(".dvPagerCities").on('click', '.pageCities', function () {
于 2013-02-06T12:52:21.107 に答える