jQuery Mobile操作HTML5的常用函数总结

2020-05-29 07:18:17易采站长站整理

type (string, default: “get”) 设置请求页面时使用的方法 (“get” 或 “post”) 。仅当 to 参数的值为一个 URL 时可用。

这里引用例子说明一下 $.mobile.changePage() 的使用方法,手动调用该方法可以触发跳转到一个新页面,例如,在 Web Apps 发生错误时可以跳转到一个提示错误的页面。


// 转入到 "about us" 页面并使用 "slideup" 转场动画
$.mobile.changePage( "about/us.html", { transition: "slideup"} );

// 转入到 "search results" 页面, 使用 来自 id 为 search 的表单数据,并把页面请求方式改为 "post"
$.mobile.changePage('searchresults.php', {
type: "post",
data: $("form#search").serialize()
});

// 转入到 "confirm" 页面并使用 "pop" 转场动画,不更新历史记录(地址栏哈希值不更新)
$.mobile.changePage('../alerts/confirm.html', {
transition: "pop",
reverse: false,
changeHash: false
});

发生错误时可以跳转到一个提示错误的页面。


$(function(){
// 发生错误
// 已 "slideup" 的方式弹出对话框提示发生了错误
$.mobile.changePage('../alerts/confirm.html', {
transition: "slideup",
role: "dialog"
});
});

2.$.mobile.loadPage()

如上面所述,$.mobile.loadPage() 用于加载一个外部页面,但这里的加载是指把外部页面的元素插入到当前 DOM 中,并在插入之前对页面内容进行 jQuery Mobile 增强 。该方法会被 $.mobile.changePage() 调用,条件是 $.mobile.loadPage() 的第一个参数 to 为 string (即加载的页面为外部页面)。这个方法仅仅是进行插入 DOM 操作,不会影响当前激活的页面,所以它可以用于在后台加载页面(只插入 DOM 而不显示页面),该方法会返回一个 deferred 对象,包含页面请求成功与否等相关信息,并会在页面增强和插入 DOM 后分解这个对象。

$.mobile.loadPage() 有两个参数 url (string or object, 必须) 和 options (object, 可选),具体情况如下:

(1)—— url (string or object, 必须)

该参数的值可以为 string 或 object ,无论是何种形式,必须为一个绝对或相对 URL 。若是由 $.mobile.changePage() 调用本方法时,则该参数值为 $.mobile.changePage() 的 to 参数值。

(2)—— options (object, 可选)

options 为可选参数,其值为 object (对象),实际上如由 $.mobile.changePage() 调用本方法时,该参数值为 $.mobile.changePage() 的 options 参数值。因此这个 object 与 $.mobile.changePage() 的 options 选项值相同,其具体属性值请参考 $.mobile.changePage() 中 options 的属性值。

这里引用例子说明一下 $.mobile.loadPage() 的使用方法,手动调用该方法可以在后台加载外部页面的元素并且不影响当前激活页面。