Question

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

由于我需要在将数据发送到下一个脚本之前修改数据，我会读取所有表单（serializeArray），根据我的需要对其进行修改，以新的形式（display：none）编写它们并让它发送到下一页。这是脚本：

$("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：警报（“每个”之前）和警报（“每次”之后）被触发，jQuery.each dons't。其他浏览器（包括Firefox Mac）没有任何问题。第一个警报，一些警报（“循环”）和最后一个警报应该启动。

这里有什么问题？

Answer 1

serializeArray()，根据Googling的一点点，通常只能用于实际的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更改为console.log。您可以在适当的调试工具（如Firebug或Chrome控制台）中检查实际元素（在大多数浏览器中点击F12以打开其控制台）。

jQuery.each在Safari上不起作用

1 个答案: