0

配送オプションとして機能する 2 つのラジオボタン (A、B) と、電話番号を入力するための入力テキストフィールドが 1 つあります。A を選択した後、テキスト領域内にカスタム ヘルプ テキストを表示する必要があります (「電話が必要です」)。ボタン B が選択されている場合、ヘルプ テキストは表示されません。

A が選択されている場合、ユーザーがテキストフィールド内をクリックして数字を入力すると、ヘルプテキストが削除されます。いずれかのオプションが選択され、テキストフィールドが入力されている場合。このままでいい。

ユーザーがAオプションを選択し、Bオプションの後に何も入力せずにヘルプテキストが削除されない場合を除いて、私のコードは機能します。

$(document).ready(function () {
  $('input#edit-quote-option-flatrate-3---0').change(function () {
    if ($('input#edit-quote-option-flatrate-3---0').is(":checked")) {


  $('.default').each(function () {
    var defaultVal = ('tel');
    $(this).focus(function () {
      if ($(this).val() == defaultVal) {
        $(this).removeClass('active').val('');
      }
    })
      .blur(function () {
      if ($(this).val() == '') {
        $(this).addClass('active').val(defaultVal);
      }
    })
      .blur().addClass('active');
  });
    } else {

        $('.default').removeClass('active').val('');

    }
  });
});

完全なコードはこちらhttp://jsfiddle.net/NKcFs/2/

4

3 に答える 3

1

やってみました：

$('.a').click(function () {
    var t = $('textarea');
    if (!t.val()) t.val('phone required');
    t.focus(function () {
       if (this.value == 'phone required') this.value = '';
    });
    t.blur(function () {
       if (!this.value) this.value = 'phone required';
    });
    $('.b').removeAttr('checked');
});
$('.b').click(function () {
    var t = $('textarea');
    if (!t.val() || t.val() == 'phone required') t.val('');
    $('.a').removeAttr('checked');
});

ここでjsFiddle を使用します。

于 2013-01-13T23:48:19.350 に答える
1

値を空白に設定する 2 番目のオプションの変更ハンドラーを追加してみてください...それがあなたがやりたかったことですよね?

   $('#edit-quote-option-flatrate-3---1').change(function(){  
    $('.default').each(function () {
      if($(this).val() == 'tel'){ // if the user didn't change it, clear the field
          $(this).val('');
      }
    });
  });

ここでフィドル: http://jsfiddle.net/gcmDu/1/

于 2013-01-13T23:50:31.583 に答える
0

特定のラジオ ボタンの選択が解除された場合、change イベントは発生しません。これを機能させる最も簡単な方法は、変更イベントのセレクターを次のように変更することです。

$('input[name="quote-option"]').change(function () { ... });

これにより、「quote-option」という名前を共有するすべてのラジオ ボタンに変更イベントが追加されるため、B が選択されたときにも発生します。

さらに、A オプションを選択したときにバインドしたイベントをバインド解除する必要があります。したがって、オプション B を選択した場合は、次のようにします。

$('.default').unbind('blur').unbind('focus');

ここでjsFiddle を更新しました。

于 2013-01-13T23:52:05.683 に答える