使用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 相关文章推荐
jQuery实现的类flash菜单效果代码
May 17 Javascript
Javascript学习笔记 delete运算符
Sep 13 Javascript
javascript按位非运算符的使用方法
Nov 14 Javascript
基于jquery实现的文字向上跑动类似跑马灯的效果
Jun 17 Javascript
jQuery表格插件datatables用法详解
Nov 23 Javascript
详解如何使用vue-cli脚手架搭建Vue.js项目
May 19 Javascript
JavaScript中document.referrer的用法详解
Jul 04 Javascript
javascript实现Java中的Map对象功能的实例详解
Aug 21 Javascript
angular项目中bootstrap-datetimepicker时间插件的使用示例
Mar 15 Javascript
jQuery pagination分页示例详解
Oct 23 jQuery
React如何解决fetch跨域请求时session失效问题
Nov 02 Javascript
jQuery 图片查看器插件 Viewer.js用法简单示例
Apr 04 jQuery
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 AJAX实例根据邮编自动完成地址信息
2008/11/23 PHP
探讨PHP函数ip2long转换IP时数值太大产生负数的解决方法
2013/06/06 PHP
在WordPress中实现发送http请求的相关函数解析
2015/12/29 PHP
JavaScript 学习笔记(十二) dom
2010/01/21 Javascript
入门基础学习 ExtJS笔记(一)
2010/11/11 Javascript
JavaScript中判断函数是new还是()调用的区别说明
2011/04/07 Javascript
JS解析json数据并将json字符串转化为数组的实现方法
2012/12/25 Javascript
关于IE中getElementsByClassName不能用的问题解决方法
2013/08/26 Javascript
js关于字符长度限制的问题示例探讨
2014/01/24 Javascript
js+csss实现的一个带复选框的下拉框
2014/09/29 Javascript
js密码强度校验
2015/11/10 Javascript
JavaScript获取当前url根目录(路径)
2016/06/17 Javascript
微信小程序 配置文件详细介绍
2016/12/14 Javascript
JavaScript实现网页头部进度条刷新
2017/04/16 Javascript
jQuery实现简单的下拉菜单导航功能示例
2017/12/07 jQuery
Angular6新特性之Angular Material
2018/12/28 Javascript
JavaScript定时器使用方法详解
2020/03/26 Javascript
vue+elementui实现点击table中的单元格触发事件--弹框
2020/07/18 Javascript
vue 遮罩层阻止默认滚动事件操作
2020/07/28 Javascript
记一次vue跨域的解决
2020/10/21 Javascript
在Python程序员面试中被问的最多的10道题
2017/12/05 Python
Python找出最小的K个数实例代码
2018/01/04 Python
Django项目中用JS实现加载子页面并传值的方法
2018/05/28 Python
python保存数据到本地文件的方法
2018/06/23 Python
Python 实现递归法解决迷宫问题的示例代码
2020/01/12 Python
使用Tensorflow实现可视化中间层和卷积层
2020/01/24 Python
Django如何使用redis作为缓存
2020/05/21 Python
HTML5 canvas标签实现刮刮卡效果
2015/04/24 HTML / CSS
您附近的水疗和健康场所:Spafinder(美国)
2019/07/05 全球购物
大学生旅游业创业计划书
2014/01/29 职场文书
大学学生会竞选演讲稿
2014/04/25 职场文书
班主任师德师风自我剖析材料
2014/10/02 职场文书
2015年试用期工作总结
2014/12/12 职场文书
2015年乡镇科普工作总结
2015/05/13 职场文书
太行山上观后感
2015/06/05 职场文书
军训通讯稿范文
2015/07/18 职场文书