0

我有这个电子邮件自动建议应用程序。一切都很好，除非我在输入字段之外单击然后单击它会清除“onFocus”中的内容。有什么想法可以阻止这种情况发生吗？ 

function suggest(inputString){
    if(inputString.length == 0) {
      $('#suggestions').fadeOut();
    } else {
    $('#email').addClass('load');
        $.post("auto.php", {queryString: ""+inputString+""}, function(data){
            if(data.length >0) {
                $('#suggestions').fadeIn();
                $('#suggestionsList').html(data);
                $('#email').removeClass('load');
          }
      });
   }
}

 function fill(thisValue) {
    $('#email').val(thisValue);
    setTimeout("$('#suggestions').fadeOut();", 600);
}

<input type="text" id="email" onKeyUp="suggest(this.value);" onClick="fill();" />
4

1 回答 1

1

每当您单击输入框时，都会onClick="fill();"执行对元素的调用。fill(undefined)

这样做的第一件事是将输入框的值设置为thisValue（当前保持undefined），这将有效地擦除您的输入框。

这与焦点无关，尝试单击该框，输入一个值然后再次单击该框，它可能也会擦除该值而无需先单击关闭。

对于它的价值，你可能过于复杂了。我想清除框的要求是删除占位符文本。如果您正在为远程新浏览器进行设计，请使用 HTML5placeholder="E-Mail"让浏览器在用户未输入任何内容时以较浅的文本（或其他任何内容）显示该内容。

如果您必须支持较旧的浏览器，也有解决此问题的方法，这是一种简单但不完美的方法（您可以对此进行概括并制作一个 jQuery 插件，或者找到一个已经存在的插件）：

HTML：

<input type="text" id="email" class="placeholder" value="E-Mail" />

CSS：

.placeholder { color: #ccc; }

Javascript：

;(function($) {

  $(document).ready(function() {

    $("#email").on('focus', function() {
      var $this = $(this);
      if ($this.hasClass('placeholder')) {
        $this.removeClass('placeholder');
        $this.val('');
      }
    });

    $("#email").on('keyUp', function() {
      // this is where your key-up code goes
    });

  });
})(jQuery);
于 2013-02-15T21:41:41.530 回答