-1

我有以下 HTML，在其中我通过将类别 ID 和名称传递给函数来动态创建类别按钮。目的是代表 div 中的类别显示产品菜单#dvsoft。

<div id="tabbed-nav2">
    <ul id="con1">
        <span>
            <div class="drinks">Drinks</div>
        </span>                                     

        <%for (int i = 0; i < dtCategory.Rows.Count; i++) {
            string str = dtCategory.Rows[i]["CategoryName"].ToString();
            int CategoryId =Convert.ToInt32(dtCategory.Rows[i]["ProductCategoryId"]);
        %>
        <li><a href="javaScript:;" value="<%= CategoryId %>" > <%= str %> </a></li>
        <%} %>
    </ul>
    <div class="center-content">
        <div id="dvSoft"></div>
    </div>
</div>

这是在单击类别按钮时调用 getDataUsingAjax 的事件处理函数：

$('#con1').on('click', 'a', function (e) { //<--CHANGED DATA TO 'a'
    var id = $(this).attr('value');
    //alert("Y123");                
    getDataUsingAjax(id);
});

在以下函数中，我从处理程序获得响应并将其附加到#dvSoftdiv 的 HTML 内容中。每个请求都会正确返回数据，但问题是只显示第一个按钮（饮料）的产品。单击任何其他类别时，不会显示任何产品。

奇怪的是，如果我在第二个按钮（膳食）上单击五六次，然后再次单击饮品，则会显示膳食项目。

function getDataUsingAjax(id) {


            $.get('<%=ResolveUrl("~/AjaxHandler.ashx") %>', { op: 'GetUserData', value: id }, function(data, status) {

                $('#dvSoft').empty();
                var siteContents = data.contents;

                $(data).each(function() {
                    var html = '<div class="items">';
                    html += '<div class="inr-item">';
                    html += '<img src="' + this.Picture + '" style="margin-top: 4px;"/>';
                    html += '</div>';

                    html += '<h4 class="item-title">';
                    html += this.ProductName;
                    html += '</h4>';

                    html += '<span class="item-rate">';
                    html += this.Price;
                    html += '</span>';
                    html += '</div>';


                    $('#dvSoft').append(html);
4

1 回答 1

1

好吧，你在做

$('#dvSoft').empty();

每次按下链接。

另一方面，您正在迭代“数据”而不是“站点内容”

于 2013-05-02T12:32:05.580 回答