.checked不会更改属性CSS状态

Question

It appears as though my simple checked property toggle doesn't want to work correctly, my function is as follows:

$('#enable_payment').click(function (e) {
            e.preventDefault();
            var form = $('.payment-system-form');
            if(form.hasClass('show-fees')){
                swal({
                    title: "Are you sure?",
                    text: "Transactions made outside........",
                    type: "error",
                    confirmButtonClass: "btn-danger",
                    confirmButtonText: "Yes!",
                    showCancelButton: true
                }, function() {
                    //on okay
                    $("input[name='enable_payment']")[0].checked = false;
                    form.removeClass('show-fees');
                }, function() {
                    //on cancel
                });
            } else {
                $("input[name='enable_payment']")[0].checked = true;
                form.addClass('show-fees');
            }
        });

Initially on page load, $("input[name='enable_payment']")[0].checked is set to true like so <input type='checkbox' name='enable_payment' checked>

I then wanted to add an alert after it was about to be toggled to disabled, as to which I needed to add the e.preventDefault() once I added this I could no longer toggle the the checked property?

I've tried doing both

$("input[name='enable_payment']").prop('checked', true);
$("input[name='enable_payment']").prop('checked');

But, if I run $("input[name='enable_payment']").prop('checked', true); within my Google Chrome Developer Tools it works as expected?

So all in all, my problem is that $("input[name='enable_payment']").checked always remains false & can't be made true again once I've clicked the okay on my swal() function

Here's the jsFiddle: https://jsfiddle.net/vcz48umx/

Answer 1

Its not working because the click event is firing on parent element of input type checkbox which is custom checker so you just need to change click function to its parent

//parent() method
$('#enable_payment').parent().click(function (e)