Question

<input name="textbox" type="text" value="Click here to type" onfocus="if(this.value=='Click here to type')this.value='';" onblur="if(this.value=='')this.value='Click here to type';">

.. onfocus / onblur在textfields上工作，但不在textarea元素上工作。是否有任何解决方法，使用jQuery可能吗？

Answer 1

onfocus和onblur事件适用于所有表单元素和主题，您可以尝试将input设为textarea，它会起作用，但我会鼓励您以编程方式进行事件绑定。

这样的事情：

var textarea = document.getElementById('textareaId'),
    message = 'Click here to type';

textarea.value = message; // set default value

textarea.onfocus = textarea.onblur = function () {

  if (this.value == '') {
    this.value = message;
  } else if (this.value == message) {
    this.value = '';
  }
};

尝试上面的示例here。

jQuery version：

$(function () { 
  var message = 'Click here to type'; 

  $('#textareaId').val(message); // set default value 

  $('#textareaId').bind('focus blur', function () { 
    var $el = $(this); 
    if ($el.val() == '') { 
      $el.val(message); 
    } else if ($el.val() == message) { 
      $el.val(''); 
    } 
  }); 
});

Answer 2

<textarea onfocus="if(this.value=='Click here to type')this.value='';" onblur="if(this.value=='')this.value='Click here to type';">Click here to type</textarea>

适合我。

如果您在值中添加一些额外的换行符/空格，则可能会失败。

Answer 3

Watermark plugin for jQuery

这个简单易用的jQuery插件增加了   HTML输入的水印功能   textarea elements。

此插件允许您指定文本   将用于水印，   并且您可以选择自己提供   将应用于的CSS类名称   每个输入或textarea元素   时间显示水印。

如果你不提供自己的课程   名称，类名“水印”是   使用

此外，这个插件允许你   更改水印文本和/或类   在水印之后的任何时间命名   初始化。

该插件也有能力   在密码中显示水印   输入元素，显示水印   在纯文本中，但然后切换到   密码保护（模糊）模式   聚焦时（因为   制作密码的复杂性   水印操作，建议   密码的程序化更改   输入元素应避免使用。）

3.0版的新功能，该插件可以   还处理输入元素   type =“search”（WebKit浏览器），和   它支持拖放   水印元素，插头原生   浏览器支持（如果可用）。

textarea中的标签

3 个答案: