0

我有一个加载 XML 文件并吐出内容的 Jquery 脚本。但是，我想将这些内容格式化为一个表格，每行 3 列。目前，它排了很长的一排，我在谷歌上没有找到任何关于在 .each 加载了几个项目之后调用新函数的信息。

重申一下，我想在if(hideproduct == ""){}成功执行 3 次之后执行函数 newrow() 。

var product_xml = "xml/products_loaded.xml"
function xmlParser() {
$.ajax({
    type: "GET",
    url: product_xml,
    dataType: "xml",
    success: function(xml) {

        function newrow(){
            $("#output").append("</tr><tr>")
        }

        $(xml).find("SAVED_EXPORT").each(function(){

            var productcode = $(this).find("productcode").text()
            var productname = $(this).find("productname").text()
            var productprice = $(this).find("productprice").text()
            var hideproduct = $(this).find("hideproduct").text()

            if(hideproduct == ""){
                $("#output").append("<td class='product' id='" + productcode + "'>"
                + "<a href='/i/" + productcode + ".htm' title='" + productname + ", " + productcode + "'>" + productname + "</a><br>"
                + "<span><font class='text colors_text'><b><span class='price'>Our Price</span>: </b></font> $" + productprice + "</span><br>"
                + "<img src='/v/vspfiles/photos/" + productcode + "-1.jpg' border='0' alt='" + productname + "'>"
                + "</td>");;

            }
        })      
    }
})
}

提前感谢任何对如何解决此问题有想法的人。

4

2 回答 2

2

关键是您需要在.each存储状态之外的计数器变量：

var count = 0;

因为您不能在回调函数中使用局部声明来存储var状态变量。.each

然后，在if (hideproduct ...)块内，计算它被调用的次数：

++count;

如有必要，调用该函数

if (count === 3) {
    newRow();
    count = 0;
}

碰巧你的newRow()函数无论如何都不起作用，因为你不能使用.append.

更好的解决方案是：

var tr = null;
var count = 0;

$(xml).find("SAVED_EXPORT").each(function() {
     if (hideproduct === "") {
         if (tr === null) {    // create a new row
             tr = $('<tr>').appendTo('#output');
         }

         tr.append(...);       // add your content

         if (++count % 3 === 0) {
             tr = null;        // force a new <tr> on the next iteration
         }
     }
});

请注意如何<tr>仅在必要时创建新内容，然后将<td>元素中的新内容直接添加到该内容中，而不是添加到#output.

于 2012-09-22T07:58:53.923 回答
0

那这个呢？

    var i = 1;
    $(xml).find("SAVED_EXPORT").each(function(){

        [...]

        if(hideproduct == ""){
            [...]
            if(i%3 == 0)
                newRow();
            i++;
        }
    });

我不确定你想在哪里测试“3-test”，但你明白了！基本上， i%3 == 0 测试将检查 i 是否是 3 的倍数（0,3,6,9...）。

于 2012-09-22T08:00:17.983 回答