当我们用鼠标经过输入框时,不用鼠标点击、亦不用右键全选,就可以得到文本框的焦点(选中文字)。另外,为了防止重复提交,当访客点击了提交以后,按钮变为灰色,实际代码:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=GB2312" />
<title>更智能人性化的表单 - 烈火学院 Liehuo.Net</title>
<!-- 脚本部分 -->
<script type="text/javascript">
function $(str){ return(document.getElementById(str)); }
function check_submit(){
if($("txt_user_name").value==""){ alert("请填写用户名"); return(false); }
if($("txt_user_pass").value==""){ alert("请填写密码"); return(false); }
if($("txt_user_pass_confirm").value==""){ alert("请填写确认密码"); return(false); }
$("submit_button").disabled=true;
return(false);
}
function mover(){
event.srcElement.focus();
event.srcElement.select();
}
function mclick(){
if(event.srcElement.value=="[请输入用户名]")event.srcElement.value="";
}
function mblur(){
if(event.srcElement.value=="")event.srcElement.value="[请输入用户名]";
}
// 烈火網 liehuo.net 真诚的欢迎复制转载,因为互联网是复制出来的,我们拒绝恶意采集 liehuo.net
</script>
</head>
<body style="overflow:auto;">
<form action="" onsubmit="return check_submit();">
用户名:<br>
<input id="txt_user_name" onmouseover="mover();"
onclick="mclick();" onblur="mblur();" value="[请输入用户名]"><br>
密码:<br>
<input id="txt_user_pass" type="password" onmouseover="mover();" value="默认密码"><br>
确认密码:<br>
<input id="txt_user_pass_confirm" type="password" onmouseover="mover();" value="默认密码"><br>
<input type="submit" value="提交" id="submit_button">
</form>
</body>
</html><br /><center>如不能显示效果,请按Ctrl+F5刷新本页,更多网页代码:<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
转自:http://www.veryhuo.com/a/view/29342.html
分享到:
相关推荐
javascript中经常用到的一个表单提交,表单点击提交按钮后变成灰色
带清除按钮的输入框,可以点击清除按钮清空输入框
NULL 博文链接:https://yezhiqiu-love-yeah-net.iteye.com/blog/751325
主要介绍了js实现鼠标点击文本框自动选中内容的方法,涉及javascript鼠标点击事件onClick及选择事件select的使用技巧,非常简单实用,需要的朋友可以参考下
制作点击输入框时默认文字消失的...01-鼠标移动上去,边框变红第一种方法 02-鼠标点击选中输入框中的提示信息 03-鼠标移动上去,边框变红第二种方法,鼠标点击选中输入框中的提示信息 04-鼠标点击输入框,提示信息消失
Qt QWebview调用JS,实现QQ邮箱自动填写输入框,模拟鼠标点击网页按钮!!
鼠标点击拉长的HTML5输入框,CSS3技术实现的动态文本框,当鼠标点击获得焦点后,输入框会自动变长,还带有发光效果,在手机上可看到这种效果,PC方面目前在一些搜索网站里得到应用。
模仿iphone输入框添加删除按钮,自定义editext
主要介绍了当鼠标滑过文本框自动选中输入框内容的JS代码,有需要的朋友可以参考一下
自己封装的一个EditText两边放加减按钮Button来控制输入框的数值
输入框,自动补全的输入框,android输入框自动补全输入框 输入框,自动补全的输入框,android输入框自动补全输入框 输入框,自动补全的输入框,android输入框自动补全输入框 输入框,自动补全的输入框,android...
自定义Edittext 带删除按钮的 Edittext 附带旋转透明动画效果,当输入内容时 右侧的删除按钮会出现,当输入框为空时 按钮会隐藏.rar,太多无法一一验证是否可用,程序如果跑不起来需要自调,部分代码功能进行参考学习...
IE8网页输入框和按钮变小解决方法.doc
ASP.net 无刷新提交数据并自动添加输入框,小例子供大家学习一下!
Android 自定义控件 EditText输入框两边加减按钮Button
输入框文字大小随长度变化 Edittext 和 TextView 文字大小随长度变化而变化 自定义输入框和文本框
网页自动填表——文本输入框及多行文本输入框 网页自动填表是指使用自动操作工具来填写网页上的表单,例如注册页面、论坛页面等等。今天我们要讨论的是如何使用自动操作工具来实现文本输入框和多行文本输入框的自动...
输入框hint文字向上浮动
// 将单元格转化成文本框 function changeTotext(obj) { var tdValue = obj.innerText; obj.innerText = ""; var txt = document.createElement("input"); txt.type = "text";... var txtValue = document....