1

我的 jQuery 脚本和 Safari（Mac + iPhone）有问题。这是页面的结构： 结构

由于我需要在将数据发送到下一个脚本之前对其进行修改，因此我读取了所有表单（serializeArray），根据需要对其进行修改，将它们写入新表单（显示：无）并让它发送到下一页. 这是脚本：

$("input#newsubmit").click(function(e) {
    e.preventDefault();
    arraytix = [];
    checkboxStatus = 0;
    $("input[id^=field]").each(function(i) {
         if ($(this).val() != 0) {
              arraytix[i] = $(this).attr('name') + ":" + $(this).val() + ":" + $(this).parent().parent().find("li.four").find("input[id*=price_item]").val() + ":" + $(this).parent().parent().find("li.five").find("input[id*=vvk_item]").val();
         }
    });

    var carttix = '';
    jQuery.each(arraytix, function(i) {
         if (arraytix.hasOwnProperty(i)) {
             if (i == arraytix.length - 1) {
                 carttix += this;
             } else {
                 carttix += this + '-';
             }
         }
    });

    $("form#finalSubmit").append( '<input name="cart" value="'+carttix+'" />');
    $("form#finalSubmit").append( '<input name="versand" value="'+$("select#item_vat_1").val()+'" />');
    $("form#finalSubmit").append( '<input name="barzahlung" value="'+checkboxStatus+'" />');
    if (checkboxStatus == 0) { 
         var fields = $("fieldset.customer").serializeArray();
         alert("before each");
         jQuery.each(fields, function(i, field){
             $("form#finalSubmit").append( '<input name="'+field.name+'" value="'+field.value+'" />');
             alert("loop");
         });
         alert("after jquery.each");
    }
    //$("form#finalSubmit").submit();
}

jQuery.each 的第一个实例在所有浏览器和平台上都按预期工作。带有 append 命令的 jQuery.each 的第二个实例不会在所有平台上的 Safari 上执行。

出于调试目的，我添加了一些警报。带有 Safari 的 Mac：alert("before each") 和 alert("after each") 被触发，jQuery.each 不会。其他浏览器（包括 Firefox Mac）没有任何问题。第一个警报、一些警报（“循环”）和最后一个警报按原样启动。

这里有什么问题？

4

1 回答 1

1

serializeArray()，根据一点谷歌搜索，通常只适用于实际form或输入元素。现在，您基本上是在尝试要求它序列化一个fieldset. 尝试将您的serializeArray()线路更改为：

var fields = $("fieldset.customer :input").serializeArray();

我认为您也可以使这段代码更清晰。我在我认为您应该调查和/或学习的地方添加了注释。在你提到的浏览器中，没有什么不应该在你提到的浏览器中工作的 jQuery 明智的，至少我看不到。我也在下面的代码中进行了上述更改：

$("#newsubmit").click(function(e) { // just the ID is faster than including the element type
    e.preventDefault();

    var arraytix = [], // added "var" to stay in local scope
        checkboxStatus = 0; // where does this get set? It's always 0

    $("input[id^=field]").each(function() { // you don't need 'i' anymore
         // find some things up front so you're not asking jQuery to
         // find them over and over again
         var $this = $(this),
             $grandParent = $this.parent().parent(),
             val = $this.val();

         if (val !== "0") { // val() usually returns a string
              // use push() to avoid creating a sparse array
              arraytix.push([
                  $this.attr('name'),
                  val, 
                  $grandParent.find("li.four").find("input[id*=price_item]").val(),      
                  $grandParent.find("li.five").find("input[id*=vvk_item]").val()
             ].join(':')); // forget about adding those colons manually
         }
    });

    // join the entries with a hyphen
    var carttix = arraytix.join('-');

    // append your elements; jquery doesn't need you to close your tags
    var $form = $('#finalSubmit'); // again, no element type in selector
    // chain calls where you can
    $form 
        .append('<input name="cart" value="'+carttix+'">')
        .append('<input name="versand" value="'+$("#item_vat_1").val()+'">')
        .append('<input name="barzahlung" value="'+checkboxStatus+'">');

    // This is always 0 -- are you setting it somewhere else?
    if (checkboxStatus == 0) { 
         // serializeArray is only supposed to work on actual input elements
         // adjusted below:
         var fields = $("fieldset.customer :input").serializeArray();
         console.log("before each");
         // Make sure fields is in the format you're expecting
         console.log(fields);
         $.each(fields, function() {
             $form.append( '<input name="'+this.name+'" value="'+this.value+'">');
             console.log("loop");
         });
         console.log("after jquery.each");
    }

    //$form.submit();
}

我把你alert的 s改成了console.log. 您可以在适当的调试工具（如 Firebug 或 Chrome 的控制台）中检查实际元素（在大多数浏览器中按 F12 以打开其控制台）。

于 2013-10-17T17:18:18.017 回答