0

フォームの値が最初のページ レンダリングから変更されるまで送信を許可しないスクリプトがあります。

ラジオボタンを除いて、すべてが機能します。それらをオンまたはオフにしようとしても、ボタンには影響しません。

誰が何が悪いのか分かりますか？(1つ以上のチェックボックスが最初のページレンダリングから変更されたかどうかを確認したい)

$(document).ready(function () {
    var button = $('#submit-data');
    $('input, select, checkbox').each(function () {
        $(this).data('val', $(this).val());
    });
    $('input, select, checkbox').bind('keyup change blur', function () {
        var changed = false;
        $('input, select, checkbox').each(function () {
            if ($(this).val() != $(this).data('val')) {
                changed = true;
            }
        });
        $('#submit-data').prop('disabled', !changed);
    });
});

編集：

チェックボックス html:

<input checked="checked" id="contactemail" name="contactemail" type="checkbox" />
<input id="contactsms" name="contactsms" type="checkbox" />
<input checked="checked" id="contactphone" name="contactphone" type="checkbox" />

編集2：

Marikkan Chelladurai からの回答からの新しいコード。ほとんど機能していますが、チェックボックスが最初にチェックされておらず、ユーザーがチェックした場合にのみ機能します。JSFiddle へのリンク

$(document).ready(function() {
    var button = $('#submit-data');

    $('input, select').each(function () {
        $(this).data('val', $(this).val());
    });


    $('input[type=radio], input[type=checkbox]').each(function (e) {
        $(this).data('val', $(this).attr('checked'));
    }); //For radio buttons

    $('input, select').bind('keyup change blur', function (e) {

        var changed = false;


        if (e.target.type == "radio" || e.target.type == "checkbox" ) {
            if($(this).data('val') !=  $(this).attr('checked')){
                changed = true;
            }
        } else {
            if ($(this).val() != $(this).data('val')) {
                changed = true;
            }
        }

        $('#submit-data').prop('disabled', !changed);

    });

});

JSFiddle へのリンク

4

2 に答える 2

2

次のように、ラジオ ボタンとチェックボックスを別の方法で処理できます。

$('input, select').not('[type=checkbox]').each(function () { $(this).data('val', $(this).val()); });

$('input[type=radio], input[type=checkbox]').each(function (e) {
    $(this).data('val', $(this).is(':checked'));
}); //For radio buttons

$('input, select').bind('keyup change', function (e) {

    var changed = false;

    if (e.target.type == "radio" || e.target.type == "checkbox" ) {
       console.log($(this).is(':checked'));
        console.log($(this).data('val'));
       if($(this).data('val') !=  $(this).is(':checked')){
            changed = true;
        }
    } else {
        if ($(this).val() != $(this).data('val')) {
            changed = true;
        }
    }
于 2013-11-07T15:03:42.890 に答える
0

コメントが言うように、radioボタンはcheckedプロパティを使用します。eventあなたに渡し、以下eachを確認してくださいtarget.type：

$('input, select, checkbox').each(function (e) {
    if (e.target.type == "radio") {
        //check radio
    } else {
        if ($(this).val() != $(this).data('val')) {
            changed = true;
        }
    }
});
于 2013-11-07T14:44:21.563 に答える