2

より大きなプロジェクトでは、テキストエリア内のテキストを更新するラジオボタンのグループがあります。ただし、ユーザーが本当にテキストを変更するかどうかを選択できるようにする必要がある場合もあります。

非表示のラジオボタンを使用していますが、ラベルのみが表示されています。確認ダイアログを表示し、テキストエリア内のテキストの変更を防ぐことはできましたが、ラジオボタンが新しくクリックされた要素をチェックするのを実際に止めることはできませんでした。以前にチェックしたラジオボタンへの参照を保存しようとしましたが、コードの後半にすでにあると思われます。さらに説明するために、JSFiddle を作成しました。ボタンのテキストと領域内のテキストが一度読み込まれると、不一致があってはなりません。

http://jsfiddle.net/e0bxnghc/1/

ユーザーのラジオボタンの選択をキャンセルする方法はありますか?

HTML:

<nav id="selectors" class="segmented-button">
    <input type="radio" name="group-1" value="car" id="radio1">
    <label for="radio1" class="first">Car</label> 
    <input type="radio" name="group-1" value="boat" id="radio2">
    <label for="radio2">Boat</label> 
    <input type="radio" name="group-1" value="plane" id="radio3">
    <label for="radio3">Plane</label> 
    <input type="radio" name="group-1" value="train" id="radio4">
    <label for="radio4" class="last">Train</label> 
</nav>

    <textarea id="output">output area</textarea>

JavaScript:

 $(document).ready(function(){
    $('#selectors label').click(function() {    
        var element = $(this).prev();
        var confirmed = false;
        var previousSelected =  $("input[name=group-1]:checked");
        var r = confirm("Are you sure you want to change the text?");
        if (r == true) {
            $("#output").val(element.val());

        } else{
            previousSelected.checked = true;
        }
    });
});
4

2 に答える 2

3

else で false を返すと、次のようになります。

else{
        previousSelected.checked = true;
        return false;
}

jsFiddle の例

于 2014-08-08T15:56:10.607 に答える
1

ラジオ ボタンのクリック イベントから「false」を返すだけで、アクションがロールバックされます。以前に選択したラジオ ボタンを保存する必要はありません。ブラウザはこれを行います：

$(document).ready(function () {
        $('input[name=Group]').click(function () {
            var confirmation = confirm('Are you sure you want to change the default message?');
            if (!confirmation) {
                return false;
            }
        })
    });
于 2016-02-20T20:25:08.887 に答える