文本框 :<input id="_text" type="text" value="这里是文本框的内容" />
按钮:<input type="button" value="提交" onclick="alert(document.getElementById('_text').value)" />
<script>
function addNumber(everyone)
{
document.getElementById("text1").value += everyone
}
</script><input type="button" onclick="addNumber(1)" value= "1"></input><input type="text" id="text1"></input><input type="button" onclick="addNumber(2)" value= "2"></input>
可以用定位来做啊,style:
.search { position:relativewidth: 462px}
.search .searchText { border: 1px solid #dddwidth: 346pxline-height: 32pxheight: 32pxpadding: 0 5pxcolor: #333}
.search .searchButton { position:absoluteright:50pxbackground: url(../images/sliced.gif) -251px 0 no-repeatwidth: 80pxheight: 32px text-indent: -9999pxborder:none}
html:
<div class="search fl">
<form action="#">
<input class="searchText" type="text" value="请输入搜索关键字" onfocus="if(this.value=='请输入搜索关键字')this.value=''" onblur="if(this.value=='')this.value='请输入搜索关键字'"/>
<input class="searchButton" type="button" value="搜索" />
</form>
<div class="clear"></div>
</div>
用js做一个正则表达式验证。、1. /^$/ 这个是个通用的格式。
^ 匹配输入字符串的开始位置;$匹配输入字符串的结束位置
2. 里面输入需要实现的功能。
* 匹配前面的子表达式零次或多次;
+ 匹配前面的子表达式一次或多次;
?匹配前面的子表达式零次或一次;
\d 匹配一个数字字符,等价于[0-9]
注意,先将jquery库引入到页面,下面是用js的jq库做的验证
checkUserNameflag=false
checkPasswordflag=false
checkPasswordAgianflag=false
checkEmailflag=false
// 用户名校验
function checkUserName() {
var username = $("userNeme").value
var zz = /^[A-Za-z0-9]{6,}$/
if (!zz.test(username)) {
$("userName_warn").innerHTML = " × 用户名不符合规范"
checkUserNameflag=false
} else {
/*$("userName_warn").style.color='blue'
$("userName_warn").innerHTML = "√ 用户名可用"*/
showUserExist(username)
checkUserNameflag=true
}
}
//重置提示
function resetWarn(){
$("userName_warn").innerHTML=""
$("email_warn").innerHTML=""
$("password_warn").innerHTML=""
$("Repassword_warn").innerHTML=""
}
// 密码校验
function checkPassword() {
var password1 = $("password").value
if (password1.length >= 6 &&password1.length <= 15) {
checkPasswordflag = true
$("password_warn").style.color='blue'
$("password_warn").innerHTML = " √ 密码可用 "
checkAgianMiMa()
} else {
checkPasswordflag = false
$("password_warn").innerHTML = " × 密码至少为 6 个字符 "
}
}
function checkPasswordAgian() {
var password1 = $("password").value
var password2 = $("rePassword").value
if (password1 == password2) {
if (password1 == "") {
$("Repassword_warn").innerHTML = " × 请输入密码 "
checkPasswordAgianflag = false
return
}
$("Repassword_warn").style.color='blue'
$("Repassword_warn").innerHTML = "√ 重复输入密码正确"
checkPasswordAgianflag = true
} else {
checkPasswordAgianflag = false
$("Repassword_warn").innerHTML = " × 两次密码输入不同 "
}
}
function checkEmail(){
//对电子邮件的验证
var myreg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/
var email=$("email").value
if(!myreg.test(email)){
checkEmailflag=false
$("email_warn").style.color='red'
$("email_warn").innerHTML = " × 邮箱格式不符合规范"
} else {
checkEmailflag=true
$("email_warn").style.color='blue'
$("email_warn").innerHTML = "√ 邮箱格式正确"
}
}
function submitCheck(){
alert(checkUserNameflag)
if(checkUserNameflag==false || checkPasswordflag==false || checkPasswordflag==false
||checkPasswordAgianflag==false || checkEmailflag==false){
return
}
}
function $(id){
return document.getElementById(id)
}
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)