JqueryMobile中绑定事件

今天遇到了jmobile中绑定事件的问题,

成都创新互联是一家集成都网站设计、网站制作、网站页面设计、网站优化SEO优化为一体的专业网络公司，已为成都等多地近百家企业提供网站建设服务。追求良好的浏览体验,以探求精品塑造与理念升华,设计最适合用户的网站页面。 合作只是第一步，服务才是根本,我们始终坚持讲诚信，负责任的原则，为您进行细心、贴心、认真的服务,与众多客户在蓬勃发展的市场环境中,互促共生。

参考:http://liyunpeng.iteye.com/blog/1964165

对页面中的绑定事件有了大概了解,不过这篇帖子年代久远,很多不是很详细,特此记录.

首先查到jmobile中的所有可以用.on()动态绑定的所有事件,

详情参考:http://www.runoob.com/jquerymobile/jquerymobile-ref-events.html

按以前的理解照抄,结果死活出不来效果,认真查看示例发现需要加"pageinit"事件

$(document).on("pageinit","#pageone",function(){
  $("p").on("tap",function(){
    $(this).hide();
  });                       
});

大概解释一下这几句代码,on的使用方式和jqeury一样,中间的参数是子集选择器,和jquery不一样的是,单击事件名字成了tap(敲击),还有个vclick(虚拟化的 click 事件处理器),亲测这2个事件效果是一样,还有如下

现在好了,可以完成自己的想法了;可是问题又来了,在有些时候会发现单击事件会触发2次....继续度娘,发现相同的情况好多,主要原因是页面初始化事件么有解绑定,与on对应的是off事件

参考:http://bbs.csdn.net/topics/390499499   完美解决

$(document).on("pageinit","#pageone",function(){
  $("p").on("tap",function(){
    $(this).hide();
  });                       
}).on("pageinit", "#page2", initPage2);

function initPage2(event) {

       $(document).off('pageinit', '#page2', initPage2);

        //在第二个页面需要绑定的事件代码

       alert("page2 init" + event.target.baseURI);

};

PS:在查阅相关文档时发现个jmobile独有的选择器:jqmData,可以这样用

alert( $(":jqmData(role='content')").length)

最后一句,充分说明:我们不生产代码,只是谷歌(被墙以后现在是度娘)的搬运工~~