jquery-mobile – jQuery Mobile打破了我的网站

当我只在移动触摸屏设备上时,我在我的网站上加载了jQuery Mobile.当我这样做的时候.它弄乱了一切.例如,选择菜单不能正常工作,页面底部会出现“加载,加载,未定义”字样.我知道我错过了什么,但不知道是什么.

关于我可能遗失的任何想法？

谢谢

编辑：好的,所以我拿出了我正在运行的所有脚本,除了jQuery和jQuery Mobile.我首先调用jQuery,然后调用jQuery Mobile.它仍然打破了网站的各个方面.

它打破了什么：
– 我无法通过导航栏导航到任何其他页面,如果我点击导航项,并查看网址,则会显示正确的网址(带有#),例如：/#/ about-us /然后,它只是重定向到主页,页面变白

>选择菜单有奇怪的结果.它打印出旁边的选择权中的任何内容.如果您在ipad上以横向模式并单击选择,它会将您发送到页面底部(很奇怪).
>它打印出’loading’两次,并在页面底部打印一次’undefined’

我所有的脚本都是jQuery和jQuery Mobile.我还应该提一下,我正在使用wordpress,所以它可能已经排队了一些其他脚本(我已经取消注册了wordpress的jquery版本并将我自己排队)

还有其他人遇到过这些问题吗？

解决方法

jQueryMobile用Ajax替换你的普通链接,所以每个页面都可以通过文档页面上的ajax文本加载：

(..)Ajax用于在导航时将每个页面的内容加载到DOM中,而DOM ready处理程序仅对第一个页面执行.要在加载和创建新页面时执行代码,您可以绑定到pageinit事件.此事件在本页底部详细说明.

如果要禁用由ajax加载的单个链接,您应该编写如下内容：

<a href="/some_page" data-ajax="false" >link</a>

或者全球化：

$(document).bind("mobileinit",function() {
  $.mobile.ajaxEnabled = false;
});

jm还会对其他元素进行替换,因此您应该尝试使用data-role属性,例如：

<select id="test" data-role="none">

禁用替换此元素.