Javascript 单击html字段值而不编辑.js文件


Javascript onclick html field value without editing .js file

<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

尝试使用 placeholder 属性(从 HTML5 开始有效):

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

或者(换句话说,如果要支持其浏览器不支持HTML5的用户),则可以测试以查看用户是否已输入用户名。如果是 null 或空字符串,请将值设置为"用户名",否则,将值设置为 $db_first_name 的值。然后更改 onBlur 事件以检查字段值的长度,如果长度为零,则使其显示"用户名"。最后,将 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>

要在较低的 html 版本中工作,不仅在 html5 中,请将所有三个位置的用户名文本更改为所需的单词或 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"/>