Question

<input type="text" 
       name='username'  
       onblur="if(this.value=='')this.value='Username';" 
       onfocus="if(this.value=='Username')this.value='';"
       value="Username" 
       class="register"/>

这是我正在使用的代码，但我的代码设置方式我想在用户输入信息之前在字段中查看文本，但现在设置表单的方式

value="<?php echo $db_first_name; ?>"

但我正在使用的代码需要

value="Username"

在用户点击之前显示字段中的用户名并输入他们自己的信息。

我试过

value="Username<?php echo $db_first_name; ?>"

但显然这没效果。任何想法？

链接查看表单的功能：http://odconnect.com/beta/registration2.php

Answer 1

尝试placeholder属性（自HTML5起有效）：

<input type="text" name="username" id="username" placeholder="Username" value="<?= $db_first_name; ?>" />

或者（换句话说，如果您想支持浏览器不支持HTML5的用户），您可以测试用户是否已输入用户名。如果是null或空字符串，请将值设置为“Username”，否则将值设置为$db_first_name的值。然后更改onBlur事件以检查字段值的长度，如果长度为零，则显示“Username”。最后，更改onFocus事件以侦听鼠标单击 - 当用户将焦点放在字段上时，将值设置为空字符串。

<input type="text" name="username" id="username" value="<?= $db_first_name == "" ? "Username" : $db_first_name ?>" onBlur="checkUsernameBlur(this, 'Username');" onFocus="checkUsernameFocus(this, 'Username');" />

<script type="text/javascript" language="javascript>
    function checkUsernameBlur(inputObj, label) {
        var strLen = inputObj.value.length;
        if (strLen == 0) {
            inputObj.value = label;
        }
    }

    function checkUsernameFocus(inputObj, label) {
        var value = inputObj.value;
        if (value == label) {
            inputObj.value = "";
        }
    }
</script>

Answer 2

要在html5中使用较低的html版本，请将所有三个地方的用户名文本更改为想要的单词或php变量

<input type="text"  name='username'  name='username' onblur="if(this.value=='')this.value='<?php echo $db_first_name; ?>';" onfocus="if(this.value=='<?php echo $db_first_name; ?>')this.value='';" value="<?php echo $db_first_name; ?>" class="register"/>

Javascript onclick html字段值，无需编辑.js文件

2 个答案: