Question

我有一个jQuery函数，它创建一个构建HTML字符串的ajax调用来填充<ul></ul>功能。问题是页面上有链接刷新页面，问题是添加了jQuery ajax调用的HTML会再次将HTML添加到页面中，这样结果就不会加倍。如果再次这样做，结果会再次添加。

所以我的问题是如何清除HTML以便结果重复多次？或者解决这个问题的最佳方法是什么？

//将副本展开到组模态组 $（“。groupZones .expand”）。live（'click'，function（）{ $（本）.siblings（ '的合同。'）显示（）。 $（this）.css（'display'，'none'）; $（this）.parent（）。parent（）。siblings（'。groupDetails'）。css（'display'，'block'）; $（this）.parent（）。parent（）。siblings（'。groupDetails'）。find（'ul.device'）。find（'ul .list'）。after（''）; var cwpUserId = $（'＃ctl00_cphBody_hfCwpId'）。val（）; var groupId = $（this）.parent（）。siblings（'。add'）。find（'input'）。val（）; sortOn =“位置”; var mode =“dayparts”; var groupUl = $（this）.parent（）。parent（）。siblings（'。groupDetails'）。find（'ul'）。find（'ul li.head'）; var groupDetails = $（this）.parent（）。parent（）。siblings（'。groupDetails'）; //获取区域详细信息.. //加载。

            $.ajax({
                type: "POST",
                url: "ajax/DaypartMessagingGroups.asmx/GetDetailsForCopyToGroup",
                data: "{'groupId':" + groupId + ",'cwpUserId':" + cwpUserId + ",'pageNum':0,'pageSize':5, 'sortOn':'" + sortOn + "','sortDirection':'" + sortDirection + "','mode':'" + mode + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(msg) {
                    //$(btn).parents("ul.list-group-zones").children("li:.head").after(msg.d);
                    $(groupUl).after(msg.d);
                    $('.location').find('.contract').hide();

                    var copyZonePerPage = 5;
                    //var copyZoneItemsCount = $(groupUl).siblings('#hfAllGroupZones').val();
                    var copyZoneItemsCount = $('#hfAllGroupZones').val();
                    var copyZonePages = Math.ceil(copyZoneItemsCount / copyZonePerPage);
                    var copyZoneHtml = '';
                    var copyZoneCurLink = 0;
                    var current_copyzone_pagination_set = 1;
                    var num_of_pagination_shown = 0;
                    alert('Line 2113 CBG');

                    if (copyZonePages > 20) {
                        //var pagesAdded = (parseInt(current_copyzone_pagination_set) - 1) * 10;

                        while (num_of_pagination_shown < 20) {
                            copyZoneHtml += '<a class="page_link_clicked" longdesc="' + copyZoneCurLink + '">' + (copyZoneCurLink + 1) + '</a>';
                            copyZoneCurLink++;
                            num_of_pagination_shown++;
                        }

                        copyZoneHtml += '<a class="page_link" id="btnNextZoneSet" longdesc="' + copyZoneCurLink + '">...</a>';

                    }
                    else {
                        while (copyZonePages > copyZoneCurLink) {
                            copyZoneHtml += '<a class="page_link_clicked" longdesc="' + copyZoneCurLink + '">' + (copyZoneCurLink + 1) + '</a>';
                            copyZoneCurLink++;
                        }
                    }

                    $(groupUl).parent().parent().find('ul li.footer').html(copyZoneHtml);
                    $('.page_link_clicked[longdesc=0]').addClass('current');

                },
                error: function(err) {
                    var err = eval("(" + err.responseText + ")");
                    if (ShowModalLogin(err.ExceptionType)) {
                        alert("An error occurred.");
                    }
                }
            });

        });

Answer 1

在您插入字符串中的内容之前，我会询问<ul>是否为空。

var $ul = $('#myUL');

if( $ul.is(':empty') )
   $ul.append( content );

或更短的版本：

$('#myUL:empty').append(content);

http://api.jquery.com/empty-selector/

请注意，:empty表示完全为空，包括空格。

修改

如果页面刷新是某些其他操作的不必要的副作用，您可以使用event.preventDefault()在处理程序中阻止这些<a>元素。

$('a.myLink').click(function( e ) { e.preventDefault(); // prevents the default behavior of the <a> element. // run your code });

Answer 2

假设您添加的内容由容器（您的<ul>）包装，只需在添加新内容之前清除容器的内容。

您可以使用jQuery .remove（）函数来完成此任务。

jQuery结果集保持填充

2 个答案: