使用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 相关文章推荐
基于iframe实现类似于ajax的页面无刷新
May 31 Javascript
JavaScript严格模式禁用With语句的原因
Oct 20 Javascript
基于Bootstrap+jQuery.validate实现Form表单验证
Dec 16 Javascript
jQuery中:image选择器用法实例
Jan 03 Javascript
js实现图片从左往右渐变切换效果的方法
Feb 06 Javascript
jQueryUI DatePicker 添加时分秒
Jun 04 Javascript
jQuery的层级查找方式分析
Jun 16 Javascript
JS控制FileUpload的上传文件类型实例代码
Oct 07 Javascript
详解如何构建Angular项目目录结构
Jul 13 Javascript
详解webpack性能优化——DLL
Oct 20 Javascript
JS+php后台实现文件上传功能详解
Mar 02 Javascript
js实现可爱的气泡特效
Sep 05 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实现表单提交数据的验证处理功能【防SQL注入和XSS攻击等】
2017/07/21 PHP
addEventListener和attachEvent二者绑定的执行函数中的this不相同
2012/12/09 Javascript
如何让页面在打开时自动刷新一次让图片全部显示
2012/12/17 Javascript
JS中的log对象获取以及debug的写法介绍
2014/03/03 Javascript
AngularJS基础知识笔记之过滤器
2015/05/10 Javascript
TypeScript 中接口详解
2015/06/19 Javascript
js实现网页抽奖实例
2015/08/05 Javascript
理解JavaScript事件对象
2016/01/25 Javascript
原生JS实现平滑回到顶部组件
2016/03/16 Javascript
Vue2.x中利用@font-size引入字体图标报错的解决方法
2018/09/28 Javascript
JS实现数组去重,显示重复元素及个数的方法示例
2019/01/21 Javascript
微信小程序添加插屏广告并设置显示频率(一天一次)
2019/12/06 Javascript
JS使用for in有序获取对象数据
2020/05/19 Javascript
Vue 数据绑定的原理分析
2020/11/16 Javascript
如何在vue中使用HTML 5 拖放API
2021/01/14 Vue.js
[01:56]《DOTA2》中文配音CG
2013/04/22 DOTA
多线程爬虫批量下载pcgame图片url 保存为xml的实现代码
2013/01/17 Python
python计算最大优先级队列实例
2013/12/18 Python
Python中尝试多线程编程的一个简明例子
2015/04/07 Python
Sublime开发python程序的示例代码
2018/01/24 Python
Python序列化与反序列化pickle用法实例
2019/11/11 Python
Python求解正态分布置信区间教程
2019/11/20 Python
PyQt5 文本输入框自动补全QLineEdit的实现示例
2020/05/13 Python
python中xlutils库用法浅析
2020/12/29 Python
matplotlib常见函数之plt.rcParams、matshow的使用(坐标轴设置)
2021/01/05 Python
详解CSS3伸缩布局盒模型Flex布局
2018/08/20 HTML / CSS
探讨HTML5移动开发的几大特性(必看)
2015/12/30 HTML / CSS
美国高端婴童品牌:Hanna Andersson
2016/10/30 全球购物
Reebonz中国官网:新加坡奢侈品购物网站
2017/03/17 全球购物
旅游管理专业个人求职信范文
2013/12/24 职场文书
现场施工员岗位职责
2014/03/10 职场文书
销售岗位职责范本
2014/06/12 职场文书
优秀本科毕业生自荐信
2014/07/04 职场文书
2015年禁毒宣传活动总结
2015/03/25 职场文书
大学文艺委员竞选稿
2015/11/19 职场文书
MySQL分区路径子分区再分区
2022/04/13 MySQL