Question

我有一个购物车，可根据数量和重量计算成本和运费。因此，有两种可能的运输选项，我有一个功能来自动选择页面加载正确的运输。但是，如果某人更改了数量，则必须再次运行选择运输的功能。

要做到这一点，我尝试了这段代码：

$('.cartInputText').on('change', function() {   
    $('#ShippingOptions option').each(function(){
        if (this.value == '163182') {
            $('#ShippingOptions option[value="163182"]').prop('selected', true)
            return false;
        }
        if (this.value == '163183') {
            $('#ShippingOptions option[value="163183"]').prop('selected', true)
            return false;
        }
    });
});

这是我第一次更改数量时的工作原理。如果我第二次更改数量它不起作用。无论我多少次更改它的工作量，我该如何解决这个问题？

更新

onchange事件第一次触发，但第二次触发。为什么呢？

Answer 1

请使用live而不是on，或者如果jquery的版本高于1.9，请使用以下代码：$(document).on('change','.cartInputText',function(){});

对于您的示例代码，您只将函数绑定到.cartInputText，如果页面重新呈现或原因导致.cartInputText重新生成，则会丢失该函数。

对于我的代码，我将函数绑定到文档，我想你知道html元素的事件可以冒泡，你点击.cartInputText然后它冒泡到文档并让函数被触发。更多，请查看jQuery中的实时和绑定差异。

Answer 2

用户KeyUp功能代替change来检测输入文字。

像：

$('.cartInputText').keyup(function () {
    alert('test');
});

这里是official jQuery documentation for .keyup().

DEMO

Answer 3

上面的代码适用于在执行前面的语句之前添加的html代码，

如果动态添加具有相同类（cartInputText）的其他内容您需要在添加内容后再次调用以上功能。

.on更改功能第一次工作不是第二次？

3 个答案: