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"/>
相关文章:
- CKeditor预览插件.js,为Chrome和IE进行编辑.因为它拒绝CSS样式
- THRE.js编辑器中的鼠标问题
- 无法加载Ace.js编辑器模式和主题(命名空间项目&AMD require.js&grunt
- 编辑CSV数组中的项目-快速CSV node.js
- 地理定位在Jsfidle中工作,但不在任何其他JS编辑器中
- 图像没有't编辑模板metro.js后显示
- 从外部js文件编辑现有的谷歌地图
- JS不工作:Sublime 3编辑器-Var main=函数()-=不是“”;激活“;(功能新手)
- 在编辑记录上可观察的挖空 JS 计算
- 在Magento的后端块(选项卡编辑表单)中添加额外的js
- Javascript 单击html字段值而不编辑.js文件
- 文本编辑工具栏解决方案 (js),具有低级自定义
- 挖空JS模板使UI在编辑时“闪现”
- 如何使用角度JS制作动态内容可编辑表
- jQuery插件“whatweather”如何编辑JS文件中的添加值
- HTML5/JavaScript游戏-编辑JS代码以更改AJAX请求
- 编辑JS文件时的Intellisense
- 在编辑JS/JSP文件时加快Eclipse的速度
- 在grunt-php2html之后编辑js文件的src字符串
- 在一个实时站点上编辑js脚本