Heim  >  Artikel  >  Web-Frontend  >  这两个方法有什么不同?_html/css_WEB-ITnose

这两个方法有什么不同?_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:41:27884Durchsuche

1、使用Jquery Moblie的初始化事件不行
$(document).on('pageinit',function() {
var mySwiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        nextButton: '.swiper-button-next',
        prevButton: '.swiper-button-prev',
        paginationClickable: true,
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: 2500,
        autoplayDisableOnInteraction: false
    });

要使用$(function(){
var mySwiper = new Swiper('.swiper-container',{
    pagination : '.swiper-pagination',
    grabCursor: true,
    paginationClickable: true,
    mousewheelControl:true,//鼠标滚轮
    autoplayDisableOnInteraction:false,
    autoplay:10000,
    speed:800,
    mode: 'horizontal',/*纵向滚动*/
});
});

JqueryMobile的“$(document).on('pageinit',function() {”  和 “$(function(){”有什么不同???

JqueryMobile的“$(document).on('pageinit',function() {” 是第一次加载执行。

$(function(){是什么时候执行???    为什么用这个方法“swiper”可以正常翻转???




回复讨论(解决方案)

$(function(){...}
在页面加载完成(即 window.load 事件发生)时执行
所以所有 jq 的预处理代码都应放在他里面
如果放在外面,则可能因为 jq 未加载完毕而失败

swiper没用过,推测应该是发生pageinit事件时swiper中的一些图片什么的还没有加载出来,因为两个事件是有先后顺序的。

pageinit是当页面已经初始化并且完成增强时触发。
$(function(){})是jquery ready() 方法的简写,完整是$(document).ready(function(){});,当然$(document).on('ready',function(){});这样写也可以。
ready是当 DOM(文档对象模型) 已经加载,并且页面(包括图像)已经完全呈现时,会发生 ready 事件。

看下面例子比较直观

<!doctype html><html><head><meta charset="utf-8"><title></title><link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css"><script src="http://code.jquery.com/jquery-1.8.3.min.js"></script><script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script><script>$(document).on('ready',function(){	alert("ready");//这时图片已经显示了});$(document).on('pageinit',function(){	alert("pageinit");//不要点确定,很明显图片还没显示});</script></head><body><img  src="http://static.csdn.net/public/common/toolbar/images/f_icon.png" / alt="这两个方法有什么不同?_html/css_WEB-ITnose" ></body></html>

拜上,谢谢各位大神。

在选择元素上绑定一个或多个事件的事件处理函数。

on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。在jQuery 1.7中,.on()方法 提供绑定事件处理程序所需的所有功能。帮助从旧的jQuery事件方法转换,see .bind(), .delegate(), 和 .live(). 要删除的.on()绑定的事件,请参阅.off()。要附加一个事件,只运行一次,然后删除自己, 请参阅.one()

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn