Javascript 根据输入更改更改类不起作用

我需要检测对select输入的更改并修改label类，但它似乎没有更改。嗯，它确实会改变，但只有一次，而不是当你再次改变的时候

$(document).ready(function(){
    var currentPayment = $(".ty-payments-list li input:checked").attr("id");
    $(".ty-payments-list li").find('label.'+currentPayment).addClass('selected');

    $('.ty-payments-list input').change(function(){
        var newPayment = $(this).attr("id");
        $(".ty-payments-list li label.selected").removeClass('selected');
        $(".ty-payments-list li").find("label."+newPayment).addClass('selected');
    });
});

HTML

---

有人有什么想法吗？

一些奇怪的浏览器问题？您是否已尝试在处理程序中再次显式查找所选输入，并查看其行为是否与您的有所不同

即代替

    var newPayment = $(this).attr("id");

试一试

---

这就是解决方案，当您更改付款方式时，它通过ajax重新加载该部分，因此总是重置我们在JS中更改的内容，因此这是我的最终解决方案：

$(document).ready(function(){
    var currentPayment = $(".ty-payments-list li input:checked").attr("id");
    $(".ty-payments-list li").find('label.'+currentPayment).addClass('selected');

    $('.ty-payments-list li label.payment_12').click(function(){
        $('.ty-payments-list li label.payment_1').removeClass('selected');
        $('.ty-payments-list li label.payment_12').addClass('selected');
        $('.cm-checkout-place-order').text('Complete my order with PayPal');
    });

    $('.ty-payments-list li label.payment_1').click(function(){
        $('.ty-payments-list li label.payment_12').removeClass('selected');
        $('.ty-payments-list li label.payment_1').addClass('selected');
        $('.cm-checkout-place-order').text('Complete my order');
    });
});

$(document).ajaxComplete(function(event,request, settings) {
    var currentPayment = $(".ty-payments-list li input:checked").attr("id");
    $(".ty-payments-list li").find('label.'+currentPayment).addClass('selected');

    $('.ty-payments-list li label.payment_12').click(function(){
        setTimeout(function () {
            $('.ty-payments-list li label.payment_1').removeClass('selected');
            $('.ty-payments-list li label.payment_12').addClass('selected');
            $('.cm-checkout-place-order').text('Complete my order with PayPal');
        }, 1000);
    });

    $('.ty-payments-list li label.payment_1').click(function(){
        setTimeout(function () {
            $('.ty-payments-list li label.payment_12').removeClass('selected');
            $('.ty-payments-list li label.payment_1').addClass('selected');
            $('.cm-checkout-place-order').text('Complete my order');
        }, 1000);
    });
});

---

你的代码对我有用，即使你在两者之间切换？当我更改一次时有效，但当我在2@James当我更改一次时有效，但当我在2之间不断更改时无效。可以创建stacksnippets来演示吗？啊，似乎是ajax重新加载了页面并失去了样式，我修正了。我投票结束这个问题，因为OP评论说他修正了这个问题，因为他发现问题中没有提到Ajax加载的内容。发布JSFIDLE或类似内容，如上所述？还有什么浏览器/操作系统？这应该是一个评论谢谢“很高兴”，这也是我的想法，但我需要50名代表发表评论，由于你投了反对票，这现在有点困难了如此接近；看来OP已经解决了他的问题。

    var newPayment = $(".ty-payments-list li input:checked").attr("id");

$(document).ready(function(){
    var currentPayment = $(".ty-payments-list li input:checked").attr("id");
    $(".ty-payments-list li").find('label.'+currentPayment).addClass('selected');

    $('.ty-payments-list li label.payment_12').click(function(){
        $('.ty-payments-list li label.payment_1').removeClass('selected');
        $('.ty-payments-list li label.payment_12').addClass('selected');
        $('.cm-checkout-place-order').text('Complete my order with PayPal');
    });

    $('.ty-payments-list li label.payment_1').click(function(){
        $('.ty-payments-list li label.payment_12').removeClass('selected');
        $('.ty-payments-list li label.payment_1').addClass('selected');
        $('.cm-checkout-place-order').text('Complete my order');
    });
});

$(document).ajaxComplete(function(event,request, settings) {
    var currentPayment = $(".ty-payments-list li input:checked").attr("id");
    $(".ty-payments-list li").find('label.'+currentPayment).addClass('selected');

    $('.ty-payments-list li label.payment_12').click(function(){
        setTimeout(function () {
            $('.ty-payments-list li label.payment_1').removeClass('selected');
            $('.ty-payments-list li label.payment_12').addClass('selected');
            $('.cm-checkout-place-order').text('Complete my order with PayPal');
        }, 1000);
    });

    $('.ty-payments-list li label.payment_1').click(function(){
        setTimeout(function () {
            $('.ty-payments-list li label.payment_12').removeClass('selected');
            $('.ty-payments-list li label.payment_1').addClass('selected');
            $('.cm-checkout-place-order').text('Complete my order');
        }, 1000);
    });
});