0

6 つのラジオ ボタンがある質問があるので、それらは 1、2、3、4、5、99 とコード化されています。逐語的な回答を入力するテキスト ボックスもあります。コード 1 ～ 5 を選択すると、テキスト ボックスの値が消えます。コード 99 を選択すると、テキスト ボックスの答えが表示されます。

ただし、テキストボックスをクリックして、先ほど入力した逐語を編集するとすぐに、テキストボックス内のすべてのテキストが消えてしまいます。

テキスト ボックスの ID: Q6_99_other

そして、ここにスクリプトがあります：

var txt = "";
$('#fieldset_Q6 input').parent().each(function () {
    $(this).click(function () {
        //alert('checked');

        $('#Q6_99_other').on('keyup change', function () {
            txt = this.value;
        })

        var id = $(this).children().attr('id');
        if (id == 'Q6_1_99') {
            $('#Q6_99_other').val(txt);
        } else {
            $('#Q6_99_other').val('');
        }

    });
});

何か提案がある人はいますか？おそらく、スクリプトの「キーアップ変更」部分を変更する必要がありますか?

どうもありがとう、ロイ

4

1 に答える 1

0

テキスト ボックスをクリックすると、クリック イベントが親要素にバブル アップします。これにより、作成したクリック ハンドラーが実行されます。子の ID は ではないためQ6_1_99、 を実行し$('#Q6_99_other').val('')、テキスト フィールドをクリアします。

このバブリングを防ぐには、次のようにします。

$("#Q6_99_other").click(function(e) {
    e.stopPropagation();
    this.focus();
});

keyup changeまた、おそらくクリック ハンドラー内にバインディングを含めるべきではありません。つまり、ユーザーが親をクリックするたびkeyup changeに、テキスト ボックスに別のハンドラーがバインドされます。クリックするたびに行うのではなく、一度だけ行う必要があります。最上位の document.ready ハンドラーでそれを行うだけです。

.each()また、ハンドラーをすべての要素にバインドするために使用する必要もありません。イベント バインディング関数はコレクションに適用でき、jQuery はそれらを自動的に反復処理します。

于 2013-10-24T05:56:19.490 に答える