Home > Web Front-end > JS Tutorial > body text

jQuery Mobile initialization event usage (detailed case explanation)

php中世界最好的语言
Release: 2018-04-26 13:37:25
Original
1937 people have browsed it

This time I will bring you the use of jQuery Mobile initialization event (detailed case explanation), what are the precautions when using jQuery Mobile initialization event, the following is a practical case, let's take a look.

jQuery Mobile includes an initialization event that loads even before jQuery's document.ready event. jQuery Mobile actually fires its initialization event on the document object itself, and the first event fired is mobileinit.

When Jquery Mobile starts executing, it will trigger the mobileinit event on the document object. Because the mobileinit event is triggered immediately after loading, you need to bind your event before Jquery Mobile loads. Handling functions, so I suggest you arrange your js reference order as follows

<script src="Jquery.js"></script>
<script src="您自己的js文件"></script>
<script src="Jquery-mobile.js"></script>
Copy after login

To extend the mobileinit event, you first need to bind it with a custom function . The mobileinit event can be extended using the bind method to override the default configuration (global options).

$(document).bind("mobileinit", function(){
//覆盖的代码
});
Copy after login

Inside the function that binds the event, you can use the $.extend method of the $.mobile object to configure the default parameter value:

$(document).bind("mobileinit", function(){
 $.extend( $.mobile , {
 foo: bar
 });
});
Copy after login

Or set it separately.

$(document).bind("mobileinit", function(){
 $.mobile.foo = bar;
});
Copy after login

$.mobile object is the starting point for setting all attributes

<script type="text/java script" src="/scripts/jquery-1.6.min.js"></script>
<script type="text/java script">
$(document).bind("mobileinit", function(){
$.mobile.defaultTransition = "slidedown";
$.mobile.ajaxLinksEnabled = false; // 禁用Ajax提交
$.mobile.ajaxFormsEnabled = false; // 禁用Ajax提交
$.mobile.ajaxEnabled = false; //禁用Ajax提交
});
</script>
<script type="text/java script" src="/scripts/mobile/jquery.mobile-1.0b1.min.js"></script>
Copy after login

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Recommended reading:

How to use form components in the Mobile framework

What are the differences between jQuery Mobile and Kendo UI

Detailed explanation of the steps for Jquery to implement cross-domain asynchronous file upload

The above is the detailed content of jQuery Mobile initialization event usage (detailed case explanation). For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!