非常奇怪的Firefox 3.6.x中的jQuery选择器错误

Question

好吧，我花了很多时间将非AJAX购物车结账转换为AJAX结帐。

我通过使用jQuery UI选项卡将各个部分分隔成选项卡来完成此操作。然后我使用AJAX在一个选项卡上发布更改并选择性地刷新其他选项卡。选择性刷新只是简单地抓取帖子的结果，并使用jQuery选择器从响应中只抓取相关的div。

在这种特殊情况下，包含送货信息的选项卡将发布并刷新带有送货方式列表的选项卡。

这完美的作品除外一个浏览器：Firefox 3.6.x的（Mac和Windows）

在Firefox 3中，选择回拉从POST，它有效地消除关键按钮，并防止结果的整数部分的结果用户继续。

以下是完整的HTML响应，使用格式：

http://pastebin.com/aVF6yUba

编辑：以上是与实际输出显然不是100％一致。这里是真正的RAW输出： http://pastebin.com/ChAT1vLf

这里是JavaScript代码的相关行：

jQuery("#shipping-method-section").html(output.html()); 

以下是其他浏览器与线拉回来：

<!--- shipping method section ---> 
<h2>Select a shipping method:</h2> 
<ul id="shipping-methods"> 
    <li><span><label><input name="shipmethod" value="FedEx+Priority+Overnight" class="shopp shipmethod" type="radio"> FedEx Priority Overnight — <strong>$30.68</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 28, 2011</span> </label> </span> </li> 
    <li> <span> <label><input name="shipmethod" value="FedEx+Standard+Overnight" class="shopp shipmethod" type="radio"> FedEx Standard Overnight — <strong>$26.46</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 28, 2011</span> </label> </span> </li> 
    <li> <span> <label><input name="shipmethod" value="FedEx+2Day" class="shopp shipmethod" type="radio"> FedEx 2Day — <strong>$19.10</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 29, 2011</span> </label> </span> </li> 
    <li> <span> <label><input name="shipmethod" value="FedEx+Express+Saver" class="shopp shipmethod" type="radio"> FedEx Express Saver — <strong>$18.79</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 30, 2011</span> </label> </span> </li> 
    <li> <span> <label><input name="shipmethod" value="FedEx+Home+Delivery" class="shopp shipmethod" checked="checked" type="radio"> FedEx Home Delivery — <strong>$13.52</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 27, 2011</span> </label> </span> </li> 
</ul> 
<hr> 
<div class="tab-back-button"> 
    <input class="tab-back-button" value="Shipping Address" type="button"> 
</div> 
<input value="Payment Method" name="shipping-method-section-button" class="shipping-method-section-button" type="button"> 

这里是什么Firefox 3.6.x回退：

<h2>Select a shipping method:</h2> 
<ul id="shipping-methods"> 
    <li><span><label><input name="shipmethod" value="FedEx+Priority+Overnight" class="shopp shipmethod" type="radio"> FedEx Priority Overnight — <strong>$30.68</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 28, 2011</span> </label> </span> </li> 
    <li> <span> <label><input name="shipmethod" value="FedEx+Standard+Overnight" class="shopp shipmethod" type="radio"> FedEx Standard Overnight — <strong>$26.46</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 28, 2011</span> </label> </span> </li> 
    <li> <span> <label><input name="shipmethod" value="FedEx+2Day" class="shopp shipmethod" type="radio"> FedEx 2Day — <strong>$19.10</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 29, 2011</span> </label> </span> </li> 
    <li> <span> <label><input name="shipmethod" value="FedEx+Express+Saver" class="shopp shipmethod" type="radio"> FedEx Express Saver — <strong>$18.79</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 30, 2011</span> </label> </span> </li> 
    <li> <span> <label><input name="shipmethod" value="FedEx+Home+Delivery" class="shopp shipmethod" checked="checked" type="radio"> FedEx Home Delivery — <strong>$13.52</strong> <span>Estimated Delivery:&nbsp;&nbsp;September 27, 2011</span> </label> </span> </li> 
</ul> 

我可以找不到任何押韵或原因。

作为临时解决方法，我编写了一些检测Firefox 3的JavaScript并强制进行全面刷新，以使它们进入下一个选项卡。

任何人有任何想法如何使这项工作正常？

谢谢！ Clif

编辑。下面是完整的JavaScript：

jQuery.post(url, data, function(output) { 
    if(error_check_passed(output, "FedEx")) 
    { 
     jQuery("#shipping-section").css({ 'opacity' : 1.0 }); 
     update_cart_summary(output); 

     hide_errors(); 
     output = jQuery("#shipping-method-section", jQuery(output)); 

     jQuery("#shipping-method-section").html(output.html()); 
     allowTabChange = true; 
     jQuery("#checkout-tabs").tabs('select', 1); 
    } 
    else 
    { 
     jQuery("#shipping-section").fadeTo('fast', 1.0); 
     show_errors(output, "FedEx"); 
    } 
}); 

Answer 1

它与两个form标签有关。我复制了你的pastebin，并将它缩减到shipping-method-section所在的部分，并且它在ff3.6中运行正常。然后我添加了该部分所在的部分，这是form部分。然后它破裂了。如果将外部form部分更改为其他任何内容，则它可以正常工作。这也是为什么如果您使用萤火虫浏览DOM（更新版本），内部表单标签将被剥离。如果你在FF3中检查你的页面。6重装前，当按钮显示正确，我想你会发现hr和所有变量后，它是在shipping-method-selectiondiv

我意识到form部分外不能改变，所以我不确定你可以做些什么来解决它。嵌套表格aren't allowed，但我知道很多人使用它们，没有任何问题。

- 编辑 -

我看了看现场，和<hr>和里面shipping-method-section。不过，我把你的整个引擎收录并做：

jQuery.post('testClifPost.html', function(output) { 

    var d = document.createElement('div'); 
    d.innerHTML = output; 
    console.log(d); 
} 

在此输出，<hr>是shipping-method-section之外。这似乎是说，它不是jQuery，但是当javascript要求它解析一些东西，当它加载到浏览器中时，firefox 3.6以不同的方式解析事情。

Answer 2

这可能是FF不喜欢<hr>标签，并打破了那里。你是否用<hr />而不是<hr>来尝试它？