如果选中单选按钮,则在文本字段内显示文本

时间:2013-01-13 21:47:33

标签: jquery

我必须使用jquery 1.3.2 我在这里有一个非常简单的任务来检查是否选中了按钮并相应地在某个文本字段中显示自定义文本。我知道问题出在这个问题的某个地方。条件内部是简单的代码,用于在具有焦点和模糊功能的文本字段中显示自定义文本

$(document).ready(function () {
  if ($('input#edit-quote-option-flatrate-3---0').is(":checked")) {
    $('input.default').val('xxx');
    $('.default').each(function () {
      var defaultVal = ('xxx');
      $(this).focus(function () {
        if ($(this).val() == defaultVal) {
          $(this).removeClass('active').val('');
        }
      })
        .blur(function () {
        if ($(this).val() == '') {
          $(this).addClass('active').val(defaultVal);
        }
      })
        .blur().addClass('active');
    });
  }
});

你能帮我调试一下为什么这段代码不符合条件?谢谢。带有html的完整代码在http://jsfiddle.net/NKcFs/

编辑:在我的页面上,有更多的rediobuttons。我只有在选择了这个特定按钮时才需要显示文字。如果访问者选择另一个按钮,则该文本应该消失。

1 个答案:

答案 0 :(得分:2)

问题是代码仅在页面加载时运行。如果选择了该点的单选按钮,则代码实际显示文本框中的文本。要使代码对复选框中的更改做出反应,您应该使用change事件:

$(document).ready(function () {
  $('input#edit-quote-option-flatrate-3---0').change(function(){
    if ($('input#edit-quote-option-flatrate-3---0').is(":checked")) {
      $('input.default').val('xxx');
      $('.default').each(function () {
        var defaultVal = ('xxx');
        $(this).focus(function () {
          if ($(this).val() == defaultVal) {
            $(this).removeClass('active').val('');
          }
        })
          .blur(function () {
          if ($(this).val() == '') {
            $(this).addClass('active').val(defaultVal);
          }
        })
        .blur().addClass('active');
      });
    }
  });
});