老师我这里有几个问题

首页课程实战体系课手记专栏慕课教程

老师我这里有几个问题

来源：4-8 编程练习

qq_麥芽糖

2019-01-16 17:28:56

<!DOCTYPE html>

<html>

<head>

</head>

<style>

*{padding: 0;margin: 0;}

.all{

width: 1000px;

margin: 50px auto;

}

.top{

width: 940px;

padding:5px 30px;

background: blue;

color: #fff;

}

.center{

background: #ddd;

height: 500px;

}

.item{

width: 100%;

}

.item span,.sex span{

color: #000;

font-size: 16px;

margin:15px 30px 15px 30%;

display: inline-block;

text-align: right;

width: 100px;

}

.item input,.sex input{

width: 180px;

}

.sex select{

width: 180px;

}

.btn{

margin-left: 45%;

margin-right: 50%;

}

.btn input{

width: 80px;

height: 35px;

margin-top: 30px;

border-radius: 5px;

color: #fff;

background: blue;

border:1px solid #000;

font-size: 16px;

line-height: 35px;

}

.b{

color: red;

margin-left: 15px;

font-weight: 100px;

}

</style>

<body>

</select>

</div>

<div class="item"><span>身份证号码:</span><input type="text" id="card" autocomplete="off"><b class="b"></b></div>

</form>

</div>

</body>

window.onload = function () {

var username = document.getElementById('username'),

password = document.getElementById('password'),

password_two = document.getElementById('password_two'),

myname = document.getElementById('myname'),

card = document.getElementById('card'),

email = document.getElementById('email'),

phone = document.getElementById('phone'),

button = document.getElementById('button'),

item = document.getElementsByClassName('item');

var innerHTMLs = {

username_innerHTML:'6-20位字母、数字或"_",字母开头',

password_innerHTML:'6-18位,包含字母、数字或符号,中间不能有空格',

password_two_innerHTML:'两次密码不一致',

myname_innerHTML:'真实名字位为2位到4位的中文',

card_innerHTML:'输入15位或者18位身份证号码',

email_innerHTML:'邮箱地址不正确',

phone_innerHTML: '手机号码不正确'

}

button.onclick = function(event){ //判断是否都输入了内容

for(var i = 0; i<item.length;i++){

//console.log(item[i].lastChild.previousSibling.value)

if (item[i].lastChild.previousSibling.value && item[i+1].lastChild.previousSibling.value !== '') {

console.log('成功提交');

}else{

//console.log(item[i].lastChild.previousSibling)

item[0].lastChild.innerHTML = innerHTMLs.username_innerHTML;

item[1].lastChild.innerHTML = innerHTMLs.password_innerHTML;

item[2].lastChild.innerHTML = innerHTMLs.password_two_innerHTML;

item[3].lastChild.innerHTML = innerHTMLs.myname_innerHTML;

item[4].lastChild.innerHTML = innerHTMLs.card_innerHTML;

item[5].lastChild.innerHTML = innerHTMLs.email_innerHTML;

item[6].lastChild.innerHTML = innerHTMLs.phone_innerHTML;

//console.log(item[i+1].lastChild.previousSibling.value);

}

event.preventDefault();

}

username.onblur = function(){//用户名

var useRegExp = /^[a-zA-Z]\w{5,20}$/;

if (username.value && useRegExp.exec(this.value)) {

this.parentNode.lastChild.innerHTML = 'OK';

}else{

this.parentNode.lastChild.innerHTML = innerHTMLs.username_innerHTML;

//this.focus();

}

password.onblur = function(){//密码

var useRegExp = /^\S{6,18}$/;

if (password.value && useRegExp.exec(this.value)) {

this.parentNode.lastChild.innerHTML = 'OK';

}else{

this.parentNode.lastChild.innerHTML = innerHTMLs.password_innerHTML;

//this.focus();

}

password_two.onblur = function(){//确认密码

if (password_two.value ===password.value && password_two.value !== '') {

this.parentNode.lastChild.innerHTML = 'OK';

}else{

this.parentNode.lastChild.innerHTML = innerHTMLs.password_two_innerHTML;

//this.focus();

}

myname.onblur = function(){//名字

var useRegExp = /^[\u4e00-\u9fa5]{2,4}$/;

if (myname.value && useRegExp.exec(this.value)) {

this.parentNode.lastChild.innerHTML = 'OK';

}else{

this.parentNode.lastChild.innerHTML = innerHTMLs.myname_innerHTML;

//this.focus();

}

card.onblur = function(){//身份证号码

var useRegExp = /^\d{15}$/;

var useRegExp2 = /^\d{18,18}$/;

var useRegExp3 = /^\d{17,17}x$/;

if (card.value && useRegExp.exec(this.value) || useRegExp2.exec(this.value) || useRegExp3.exec(this.value)) {

this.parentNode.lastChild.innerHTML = 'OK';

}else{

this.parentNode.lastChild.innerHTML = innerHTMLs.card_innerHTML;

//this.focus();

}

email.onblur = function(){//email

//12323@qq.com、lulu_s@open.com、lu_lu_z@qq.com.cn

var useRegExp = /(\w+\.)*\w@(?:\w+\.)+[a-z]/i;

if (email.value && useRegExp.exec(this.value) ) {

this.parentNode.lastChild.innerHTML = 'OK';

}else{

this.parentNode.lastChild.innerHTML = innerHTMLs.email_innerHTML;

//this.focus();

}

phone.onblur = function(){//phone

var useRegExp = /^13\d{9}|15[0,1,2,3,5,6,7,8,9]{1}\d{8}|18[0,2,5,6,7,8,9]{1}\d{8}$/;

if (phone.value && useRegExp.exec(this.value) ) {

this.parentNode.lastChild.innerHTML = 'OK';

}else{

this.parentNode.lastChild.innerHTML = innerHTMLs.phone_innerHTML;

//this.focus();

}

</script>

</html>

//item[i].lastChild.previousSibling.value && item[i+1].lastChild.previousSibling.value !== ''这里如果用这种方式写的话，到最后那个框会报错

item[0].lastChild.innerHTML = innerHTMLs.username_innerHTML;

item[1].lastChild.innerHTML = innerHTMLs.password_innerHTML;

item[2].lastChild.innerHTML = innerHTMLs.password_two_innerHTML;

item[3].lastChild.innerHTML = innerHTMLs.myname_innerHTML;

item[4].lastChild.innerHTML = innerHTMLs.card_innerHTML;

item[5].lastChild.innerHTML = innerHTMLs.email_innerHTML;

item[6].lastChild.innerHTML = innerHTMLs.phone_innerHTML;

*/ 这里如果用循环的话怎么实现

还有我按提交后，输入框的内容是有的，但是提交后它显示我定义输入错误的内容如：6-20位字母、数字或"_",字母开头

写回答

1回答

好帮手慕星星

2019-01-16

已采纳

你好，代码中的问题：

1、是使用了item[i+1].lastChild报错，因为最后一个输入框后面没有item了，更没有子元素，所以会报错，写一个条件就可以了，参考：

2、因为innerHTMLs对象中每个属性名不同，所以如果想要使用for循环，需要再定义一个数组，参考：

3、点击提交并没有改变提示信息

自己可以测试下，祝学习愉快！

0 学习 · 4826 问题

查看课程

相似问题

视频中为什么正则表达式是放在title属性里？

回答 5

老师,有几点疑惑

回答 2

老师我这里还有一个问题

回答 2

老师,有两个疑问

回答 2

老师，我这里的问题是什么？

回答 1

打开慕课网App查看更多内容