使用jQuery mobile库检测url绝对地址和相对地址的方法


Posted in Javascript onDecember 04, 2015

path.isAbsoluteUrl() 检测绝对网址

jQuery.mobile.path.isAbsoluteUrl(url)

如果一个URL是绝对的实用方法。如果URL是绝对的这个函数返回一个布尔值 true ,否则返回 false。

<!doctype html>
<html lang="en">
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>jQuery.mobile.path.isAbsoluteUrl demo</title>
 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css">
 <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
 <!-- The script below can be omitted -->
 <script src="/resources/turnOffPushState.js"></script>
 <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
 <style>
 #myResult{
 border: 1px solid;
 border-color: #108040;
 padding: 10px;
 }
 </style>
</head>
<body>
 
<div data-role="page">
 
 <div data-role="content">
 <input type="button" value="http://foo.com/a/file.html" id="button1" class="myButton" data-inline="true" />
 <input type="button" value="//foo.com/a/file.html" id="button2" class="myButton" data-inline="true" />
 <input type="button" value="/a/file.html" id="button3" class="myButton" data-inline="true" />
 <input type="button" value="file.html" id="button4" class="myButton" data-inline="true" />
 <input type="button" value="?a=1&b=2" id="button5" class="myButton" data-inline="true" />
 <input type="button" value="#foo" id="button6" class="myButton" data-inline="true" />
 <div id="myResult">The result will be displayed here</div>
 </div>
</div>
<script>
$(document).ready(function() { 
 $( ".myButton" ).on( "click", function() { 
  var isAbs = $.mobile.path.isAbsoluteUrl( $( this ).attr( "value" ) ); 
 $( "#myResult" ).html( String( isAbs ) );
 }) 
});
</script>
 
</body>
</html>

 

path.isRelativeUrl() 检查相对网址

jQuery.mobile.path.isRelativeUrl( url )

如果URL是相对的网址,这个函数返回一个布尔值 true,否则返回 false。

<!doctype html>
<html lang="en">
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>jQuery.mobile.path.isRelativeUrl demo</title>
 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css">
 <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
 <!-- The script below can be omitted -->
 <script src="/resources/turnOffPushState.js"></script>
 <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
 <style>
 #myResult{
 border: 1px solid;
 border-color: #108040;
 padding: 10px;
 }
 </style>
</head>
<body>
 
<div data-role="page">
 
 <div data-role="content">
 <input type="button" value="http://foo.com/a/file.html" id="button1" class="myButton" data-inline="true" />
 <input type="button" value="//foo.com/a/file.html" id="button2" class="myButton" data-inline="true" />
 <input type="button" value="/a/file.html" id="button3" class="myButton" data-inline="true" />
 <input type="button" value="file.html" id="button4" class="myButton" data-inline="true" />
 <input type="button" value="?a=1&b=2" id="button5" class="myButton" data-inline="true" />
 <input type="button" value="#foo" id="button6" class="myButton" data-inline="true" />
 <div id="myResult">The result will be displayed here</div>
 </div>
</div>
<script>
$(document).ready(function() { 
 $( ".myButton" ).on( "click", function() { 
  var isRel = $.mobile.path.isRelativeUrl( $( this ).attr( "value" ) ); 
 $( "#myResult" ).html( String( isRel ) );
 }) 
});
</script>
 
</body>
</html>

 

Javascript 相关文章推荐
THREE.JS入门教程(6)创建自己的全景图实现步骤
Jan 25 Javascript
一个简单的Node.js异步操作管理器分享
Apr 29 Javascript
浅谈setTimeout 与 setInterval
Jun 23 Javascript
基于jquery实现智能表单验证操作
May 09 Javascript
浅谈Vue数据响应
Nov 05 Javascript
js中async函数结合promise的小案例浅析
Apr 14 Javascript
JS实现给数组对象排序的方法分析
Jun 24 Javascript
React路由鉴权的实现方法
Sep 05 Javascript
VUE项目初建和常见问题总结
Sep 12 Javascript
Vue实现手机扫描二维码预览页面效果
May 28 Javascript
微信小程序实现自定义动画弹框/提示框的方法实例
Nov 06 Javascript
js实现圆形菜单选择器
Dec 03 Javascript
jQuery移动web开发之页面跳转和加载外部页面的实现
Dec 04 #Javascript
详解JavaScript逻辑And运算符
Dec 04 #Javascript
JavaScript encodeURI 和encodeURIComponent
Dec 04 #Javascript
详解JavaScript逻辑Not运算符
Dec 04 #Javascript
简要了解jQuery移动web开发的响应式布局设计
Dec 04 #Javascript
jQuery1.9.1源码分析系列(十六)ajax之ajax框架
Dec 04 #Javascript
jQuery使用$.ajax进行异步刷新的方法(附demo下载)
Dec 04 #Javascript
You might like
php实现httpclient类示例
2014/04/08 PHP
php防止网站被攻击的应急代码
2015/10/21 PHP
[原创]PHPCMS遭遇会员投稿审核无效的解决方法
2017/01/11 PHP
xml分页+ajax请求数据源+dom取结果实例代码
2008/10/31 Javascript
js中if语句的几种优化代码写法
2011/03/12 Javascript
探讨在JQuery和Js中,如何让ajax执行完后再继续往下执行
2013/07/09 Javascript
JS分页效果示例
2013/10/11 Javascript
Node.js中的流(Stream)介绍
2015/03/30 Javascript
JavaScript随机生成信用卡卡号的方法
2015/04/07 Javascript
js兼容火狐获取图片宽和高的方法
2015/05/21 Javascript
javascript实现的闭包简单实例
2015/07/17 Javascript
理解javascript定时器中的单线程
2016/02/23 Javascript
深入理解JavaScript定时机制
2016/10/27 Javascript
Javascript 闭包详解及实例代码
2016/11/30 Javascript
nodejs 终端打印进度条实例代码
2017/04/22 NodeJs
webpack4.x开发环境配置详解
2018/08/04 Javascript
JavaScript实现与使用发布/订阅模式详解
2019/01/19 Javascript
vue.js+ElementUI实现进度条提示密码强度效果
2020/01/18 Javascript
webpack+vue.js构建前端工程化的详细教程
2020/05/10 Javascript
Vue实现圆环进度条的示例
2021/02/06 Vue.js
[01:33:30]DOTA2-DPC中国联赛 正赛 RNG vs Phoenix BO3 第二场 2月5日
2021/03/11 DOTA
跟老齐学Python之正规地说一句话
2014/09/28 Python
Python实现PS图像明亮度调整效果示例
2018/01/23 Python
python实现猜数字小游戏
2020/03/24 Python
Django框架的中的setting.py文件说明详解
2018/10/15 Python
python-xpath获取html文档的部分内容
2020/03/06 Python
python中spy++的使用超详细教程
2021/01/29 Python
css3 线性渐变和径向渐变示例附图
2014/04/08 HTML / CSS
西班牙自行车和跑步商店:Alltricks
2018/07/07 全球购物
市场部规章制度
2014/01/24 职场文书
县级领导干部开展党的群众路线教育实践活动工作汇报
2014/10/25 职场文书
项目投资意向书范本
2015/05/09 职场文书
住房公积金贷款工资证明
2015/06/12 职场文书
运动会通讯稿200字
2015/07/20 职场文书
小学教师教育随笔
2015/08/14 职场文书
《观察物体》教学反思
2016/02/17 职场文书