点击切换帐号登陆
帐号密码登陆

如何过滤用户留言中的手机号?

3.实战: 过滤留言中的手机号码
=======================

**知识点**
1. 原子集合与量词的使用
2. 基本的DOM操作

---------------------------------------------------

1.原子集合与量词的使用
------------------
- `/[1][345678][0-9]{9}/`

---------------------------------------------------

2.基本的DOM操作
-------------
- 向页面中添加元素
- 基本事件处理

---------------------------------------------------

### 示例: code/demo04.html

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>手机号码验证</title>
</head>
<body>
<label for="reply">回复</label>
<textarea name="" id="reply" cols="30" rows="10"></textarea>
<p id="tips"></p>
<ul id="list"></ul>

<script>
    // 测试文本:  你寂寞吗?想看更多小视频,13988996677, 微信同号哟
    var text = document.querySelector('#reply');
    var tips = document.querySelector('#tips');

    text.onblur = function () {
        if (verifyPhone(text.value)) {
            tips.innerHTML = '<span style="color:red">留言中不允许出现手机号</span>';
            return false;
        }

        if (text.value.trim().length > 0) {
            var list = document.querySelector('#list');
            var comment = document.createElement('li');
            comment.innerText = text.value;
            list.appendChild(comment);
            text.value = '';
        } else {
            tips.innerHTML = '<span style="color:red">留言不能为空</span>';
            text.focus();
        }

    };

    text.onkeydown = function () {
        tips.innerHTML = '';

    };

    // 验证是否是手机号码?
    function verifyPhone(mobile) {
        var reg = /[1][345678][0-9]{9}/;
        return reg.test(mobile);
    }
</script>
</body>
</html>
```


任务

?不会了怎么办
无数据提示暂无评论哟...我要评论
网站导航
标签地图
学习路径
视频教程
开发软件
旗下子站
技术文章
文档工具
关于我们
企业合作
人才招聘
联系我们
讲师招募
QQ交流群
QQ官方交流群
微信公众号
微信公众号