文本字段中的Javascript默认文本，如tumblr

Question

我希望输入字段中的默认文本为灰色。但是用户不应该选择此文本，也不能删除。

示例：

用户输入名称Susan。在他们停止输入后，它将显示如下：SusanCartel。灰色部分自动显示为预览。然后，当他们点击创建时，我们会看到SusanCartel。这样，人们不会偶然输入SusanCartelCartel，因为他们会看到预览。

Answer 1

HTML5具有您可以使用的新placeholder属性：

<label for="username">Username:</label>
<input type="text" name="username" id="username" placeholder="Type your username..." />

但是，这在IE或旧浏览器中不起作用。

This plugin将实现跨浏览器的相同效果。

Answer 2

我通常使用jquery-watermark。有关详细信息，请查看此plugin链接。

用法：

$('#inputid').watermark('Required information', {className: 'myClassName'});

此外，如果您仔细阅读介绍，您会遇到这一点

  

本机支持HTML5“占位符”功能（在浏览器中）   支持它），或者可以禁用本机支持以便插件   控制所有水印