javascript - 每次我使用 ajax 从 WebMethod 加载数据时，如何使脚本运行？

Question

我有一个问题，javascript 脚本只在页面加载时加载一次，但我每次从服务器端的 WebMethod 获取数据时都需要它

这是我的代码:

我的 JavaSript ajax:

<script type="text/javascript">


    $(document).ready(function () {

        function InfiniteScroll() {

            $('#divPostsLoader').html('<img src="img/loader.gif">');

            $.ajax({
                type: "POST",
                url: "Home.aspx/GetLastArticles",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    if (data != "") {

                        $('#divPostsLoader:last').after(data.d);

                    }
                    $('#divPostsLoader').empty();
                },
                error: function (data) {
                    if (!document.getElementById('#divPostsLoader').innerHTML == "<p>END OF POSTS</p>")
                        $('#divPostsLoader').empty();
                    $('#divPostsLoader').html("<p>END OF POSTS</p>");
                }
            })

        };
        var b = false;
        //When scroll down, the scroller is at the bottom with the function below and fire the lastPostFunc function
        $(window).scroll(function () {

            if ($(document).height() <= $(window).scrollTop() + $(window).height()) {
                InfiniteScroll();

            }

            b = true;
        });
        if (!b) {

            window.onload = function () {
                InfiniteScroll();

            };

        }
    });

</script>

这是我的 javasript，我希望它在每次从 GetLastArticles WebMethod 获取数据时触发:

<script type="text/javascript">
    $(".tag_button").on('click', function (e) {
        e.preventDefault(); // prevent default action - hash doesn't appear in url
        $(this).parent().find('div').toggleClass('tags-active');
        $(this).parent().toggleClass('child');


    });
</script>

我的 aspx 页面(客户端):

<div class="tags_list">
                                    <a class="tag-icon tag_button" href="#" >Tags</a>
                                    <div class="tags">
                                        <a class="tag-icon" href="#" >Tag1</a>
                                        <a class="tag-icon" href="#">Tag2</a>
                                        <a class="tag-icon" href="#">Tag3</a>
                                        <a class="tag-icon" href="#">Tag4</a>
                                        <a class="tag-icon" href="#">Tag5</a>
                                        <a class="tag-icon" href="#">Tag6</a>
                                        <a class="tag-icon" href="#">Tag7</a>
                                    </div>
                                </div>

Answer 1

更改为以下内容，事件处理程序也附加到动态添加的元素。

$(document).on('click', '.tag_button', function() {...});

语法解释

只是为了澄清代码。语法如下:

$(document).on(events, cssSelector, handler);

查看完整 API on jQuery API documentation .通过选择 document，我们确保此事件处理程序现在和将来都加载到文档中的所有元素。