从ajax返回的jquery无法正常工作

Question

所以我有2个单选按钮，可以更改页面中的一行。

要更改的行的代码是：

<span id='checkout_total' class="pricedisplay checkout-total">
<span class='pricedisplay'>&#036;13.00</span></span>

单击单选按钮时，我有一个返回此的ajax请求：

jQuery('.pricedisplay.checkout-total').html("<span class='pricedisplay'>&#036;16.00</span>");

所以现在span class ='pricingisplay'应该显示16.00而不是13.00

问题是，它在页面中没有变化..仍然显示13.00。

如果我在chrome中使用dev工具并在控制台中粘贴jquery行，则会正确更改

Answer 1

您的选择器应该是#checkout_total或.checkout_total ..不能使用.pricedisplay因为两个跨距都有相同的类，而您正在替换span内的<span id='checkout_total' class="pricedisplay checkout-total">元素1}}

 $(function(){  //just incase if you missed this
    jQuery('#checkout_total').html("<span class='pricedisplay'>&#036;16.00</span>");
 });

因为你在该元素中提到了一个id ..我会选择jQuery('#checkout_total')。

如果您只需更改span内的文本，则可以使用

jQuery('#checkout_total .pricedisplay').text("$16.00");

Answer 2

尝试一下（代码更轻）

jQuery('#checkout_total .pricedisplay').html("$16.00");