Question

我正在尝试找到一个脚本，该脚本将填充一个带有“填写您的电子邮件地址”等文本的optin表单的文本字段，并在点击时消失。我知道他们都在网上，但搜索它只返回javascript自动填充脚本，其中的建议从文本字段下方的下拉列表中列出。

Answer 1

HTML5支持占位符文本，您可以像这样使用

  <input name="email" placeholder="Enter your email address" />

单击文本字段时，这将自动消失。对于旧版浏览器，您可以使用上述建议之一。

Answer 2

这是我在我的网站Expiringlinks.co上使用的内容。现在，如果您只想将其应用于一个输入，请将$（'input'）更改为$（'＃yourinputid'）。输入字段的值字段应与之前的文本相等。

var tempValue='';
    $('input').click(function(){
        tempValue = $(this).attr('value');
        $(this).attr('value','');

    });

    $('input').focusout(function(){
        if ($(this).attr('value')==''){
        $(this).attr('value',tempValue);
        }


    });

为您输入字段

<input type="text" value="Whatever you want to show before the click" />

Answer 3

jsFiddle example

或者，稍微不同的fiddle不需要标签上的ID，但需要将文本框/标签包装在某些内容中，例如<p>标记。

HTML

<input type="text" name="email_address" id="Email" />
<label for="Email" id="EmailLabel">Please enter your email address</label>

CSS

label
{
    display: none;
}

的jQuery

$(document).ready(function()
{
    $('#Email').focus(function()
    {
        $('#EmailLabel').show();
    }).blur(function()
    {
        $('#EmailLabel').hide();
    });
});

预填充文本字段的脚本

3 个答案: