思路:
1, 创建一个输入框, 使用 jQuery 给它注册 change 事件;
2, 创建一个函数 checkUrl, 传入一个 url 参数;
3, 函数内编写一条检测 url 正确性的正则 strRegex;
4, 使用 test() 方法对 url 参数进行检测即可.
代码示例:(相关课程推荐: jQuery 教程 https://www.html.cn/jskuangjia/jquery/ )
注: 只写了重要的代码
- <script src="./jquery.js"></script>
- <div id="app">
- <input type="text" id="url">
- </div>
- <script>
- // 本代码来自 https://blog.csdn.net/eddy23513/article/details/80194269
- function checkUrl(url) {
- var strRegex = '^((https|http|ftp|rtsp|mms)?://)?'
- +'(([0-9a-z_!~*().&=+$%-]+: )?[0-9a-z_!~*().&=+$%-]+@)?' //ftp 的 user@
- +'(([0-9]{1,3}.){3}[0-9]{1,3}|'// IP 形式的 URL- 199.194.52.184
- +'([0-9a-z_!~*()-]+.)*'// 域名 - www.
- +'[a-z]{2,6})'// 域名的扩展名
- +'(:[0-9]{1,4})?'// 端口 - :80
- +'((/?)|(/[0-9a-z_!~*().;?:@&=+$,%#-]+)+/?)$';
- return new RegExp(strRegex).test(url);
- }
- // 输入框注册事件
- $('#url').change(function(){
- let res = checkUrl(this.value)
- console.log(this.value, res)
- })
- </script>
测试:
本文来自 jQuery 答疑 https://www.html.cn/qa/jquery/ 栏目, 欢迎学习!
来源: http://www.css88.com/qa/jquery/15489.html