jQuery mobile转换url地址及获取url中目录部分的方法
path.makeUrlAbsolute()把相对URL转化为绝对URL
jQuery.mobile.path.makeUrlAbsolute(relUrl,absUrl)
把相对URL转化为绝对URL的方法。这个函数返回一个字符串,绝对URL。
relUrl:相对网址。类型:字符串。
absUrl:绝对网址。类型:字符串。
<!doctypehtml>
<htmllang="en">
<head>
<metacharset="utf-8">
<metaname="viewport"content="width=device-width,initial-scale=1">
<title>jQuery.mobile.path.makeUrlAbsolutedemo</title>
<linkrel="stylesheet"href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css">
<scriptsrc="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!--Thescriptbelowcanbeomitted-->
<scriptsrc="/resources/turnOffPushState.js"></script>
<scriptsrc="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
<style>
#myResult{
border:1pxsolid;
border-color:#108040;
padding:10px;
}
</style>
</head>
<body>
<divdata-role="page">
<divdata-role="content">
<p>TheabsoulteURLusedishttp://foo.com/a/b/c/test.html</p>
<inputtype="button"value="file.html"id="button1"class="myButton"data-inline="true">
<inputtype="button"value="../../foo/file.html"id="button2"class="myButton"data-inline="true">
<inputtype="button"value="//foo.com/bar/file.html"id="button3"class="myButton"data-inline="true">
<inputtype="button"value="?a=1&b=2"id="button4"class="myButton"data-inline="true">
<inputtype="button"value="#bar"id="button5"class="myButton"data-inline="true">
<divid="myResult">Theresultwillbedisplayedhere</div>
</div>
</div>
<script>
$(document).ready(function(){
$(".myButton").on("click",function(){
varabsUrl=$.mobile.path.makeUrlAbsolute($(this).attr("value"),"http://foo.com/a/b/c/test.html");
$("#myResult").html(absUrl);
})
});
</script>
</body>
</html>
path.get()确定URL中的目录部分
jQuery.mobile.path.get(url)
url:只有一个参数。类型:字符串。
确定URL中的目录部分的实用方法。如果URL没有斜线,URL的一部分被认为是一个文件。这个函数返回一个给定的URL目录部分。
<!doctypehtml>
<htmllang="en">
<head>
<metacharset="utf-8">
<metaname="viewport"content="width=device-width,initial-scale=1">
<title>jQuery.mobile.path.getdemo</title>
<linkrel="stylesheet"href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css">
<scriptsrc="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!--Thescriptbelowcanbeomitted-->
<scriptsrc="/resources/turnOffPushState.js"></script>
<scriptsrc="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
<style>
#myResult{
border:1pxsolid;
border-color:#108040;
padding:10px;
}
</style>
</head>
<body>
<divdata-role="page">
<divdata-role="content">
<inputtype="button"value="http://foo.com/a/file.html"id="button1"class="myButton"data-inline="true"/>
<inputtype="button"value="http://foo.com/a/"id="button2"class="myButton"data-inline="true"/>
<inputtype="button"value="http://foo.com/a"id="button3"class="myButton"data-inline="true"/>
<inputtype="button"value="//foo.com/a/file.html"id="button4"class="myButton"data-inline="true"/>
<inputtype="button"value="/a/file.html"id="button5"class="myButton"data-inline="true"/>
<inputtype="button"value="file.html"id="button6"class="myButton"data-inline="true"/>
<inputtype="button"value="/file.html"id="button7"class="myButton"data-inline="true"/>
<inputtype="button"value="?a=1&b=2"id="button8"class="myButton"data-inline="true"/>
<inputtype="button"value="#foo"id="button9"class="myButton"data-inline="true"/>
<divid="myResult">Theresultwillbedisplayedhere</div>
</div>
</div>
<script>
$(document).ready(function(){
$(".myButton").on("click",function(){
vardirName=$.mobile.path.get($(this).attr("value"));
$("#myResult").html(String(dirName));
})
});
</script>
</body>
</html>