0

我用这段代码创建了一个字段

<tr><td> <input type="text" value="good"  onfocus="if (this.value == 'good') {this.value=''}" onblur="if(this.value == '') { this.value='good'}" name="name" maxlength="254" class="required" /></td></tr>

当用户单击字段时,我们有明确和空的字段。如果用户将字段为空,我们会写回这个good值。但这不是我想要的,我正在寻找类似 facebook 中的用户注册表单的方式,然后如果用户输入一个字符我们清除值,如果用户将字段保留为空,我们将使用默认值填写此字段..有人可以帮我处理这个 javascript 或 jquery 吗?

4

3 回答 3

1

您可以只使用该placeholder属性

<tr>
    <td>
        <input type="text" placeholder="good" name="name" maxlength="254" class="required" />
    </td>
</tr>

只要用户没有输入文本,这就会显示出来,但不会更改value属性。

JSFiddle用于测试。

于 2013-02-26T19:09:24.477 回答
1

尝试将您的输入更改为:

<tr>
    <td>
        <input type="text" value="good" placeholder="good" name="name" maxlength="254" class="required defaultText" />
    </td>
</tr>

并添加一些 jQuery 代码:

$(document).ready(function() {
    $(".defaultText").focus(function(srcc) {
        if ($(this).val() == $(this)[0].placeholder) {
            $(this).val("");
        }
    });

    $(".defaultText").blur(function() {
        if ($(this).val() == "") {
            $(this).val($(this)[0].placeholder);
        }
    });

    $(".defaultText").blur();        
});

样式类,defaultText用于选择 html 元素,placeholder元素中的 为它定义默认值。

编辑:更改titleplaceholder,这样它将与 html5 或以前的版本兼容

示例来自这里。

于 2013-02-26T19:10:57.863 回答
1

如果占位符属性不可行,您可以使用 onkeydown 事件而不是 onfocus。

于 2013-02-26T19:12:19.260 回答