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>