如何使用jQuery Mobile仅支持触摸事件(没有UI增强功能)？

Question

我正在开发一个具有自己外观和感觉的网络应用程序.我想使用jQuery Mobile仅支持触摸事件.

当我链接jquery.mobile.min.js(没有链接css),然后我的页面布局被打破.

如何配置(初始化)jQuery Mobile以仅使用触摸事件支持？我是否会在jQuery文档就绪钩子中绑定事件,因为我没有任何与JQM页面相关的事件？

编辑

在jsfiddle中查看此示例:http://jsfiddle.net/redhotsly/JGgrw/.html包含一个<button>但jQuery Mobile在<span>其左侧创建了一个.如果检查生成的标记(F12),您将看到jQuery Mobile还在我的按钮中添加了一个CSS类.

编辑:

我需要一个解决方案,我不会修改JQM脚本.我需要使用CDN上的官方脚本.

Answer 1

如果你只想绑定到触摸/手势事件,我会使用jGestures代替:

http://jgestures.codeplex.com/

我之前在项目中使用的一个很好的小jquery插件,可以绑定大量的事件:

可用活动:

orientationchange设备顺时针或逆时针旋转.此事件由设备触发,可能使用内部陀螺仪.

捏合在捏合手势期间触发(两个手指彼此远离或朝向彼此移动).

旋转在旋转手势期间触发(两个手指顺时针或逆时针旋转).

swipemove在滑动移动手势(手指在设备周围移动,例如拖动)期间触发

swipeone在使用一个接触点(一个手指在设备周围移动)的滑动移动手势后触发

swipetwo在使用两个接触点(两个手指在设备周围移动)的滑动移动手势后触发

swipethree在具有三个接触点的滑动移动手势(三个手指在设备周围移动)后触发

swipefour在具有四个接触点的滑动移动手势(四个手指在设备周围移动)后触发

swipeup在严格向上滑动移动手势后触发

swiperightup在向右和向上滑动移动手势后触发

swiperight在严格向右滑动移动手势后触发

swiperightdown在钻机*向上和向下滑动移动手势后触发

swipedown在严格向下滑动移动手势后触发

swipeleftdown在向左和向下滑动移动手势后触发

swipeleft在严格向左滑动移动手势后触发

swipeleftup在向左和向上滑动移动手势后触发

tapone在单个(单指)轻击手势后触发

taptwo在双(两个手指)轻击手势后触发

tapthree在三指(三指)轻击​​手势后触发

pinchopen当一个pinchopen手势(两个手指彼此远离)发生并且接触点(手指)被移除时触发.

pinchclose在pinchclose手势(两个手指朝向彼此移动)发生并且触点(手指)被移除设备时被触发.

rotatecw当顺时针旋转手势(两个手指顺时针旋转)发生并且触点(手指)被移除时触发.

rotateccw当逆时针旋转手势(两个手指逆时针旋转)发生并且触点(手指)被移除时触发.

Answer 2

如果您只想将jQuery mobile用于触摸事件,请在加载jQuery移动库之前添加此脚本:

<script type="text/javascript">$(document).bind("mobileinit", function(){$.extend(  $.mobile , {autoInitializePage: false})});</script>

这可以防止jquery mobile初始化页面并触摸DOM,从而使您的布局保持独立.

Answer 3

jQuery Mobile现在有一个下载构建器,可以让你只选择你想要的部分,在这种情况下,你只需要选择Event部分下的Touch复选框.

http://jquerymobile.com/download-builder/

Answer 4

jQM现在解耦了:

• http://jquerymobile.com/blog/2011/08/03/jquery-mobile-beta-2-released/

小部件:现在解耦为灵活的构建

我们想要将所有小部件与页面插件分离很长一段时间,我们很高兴地宣布我们终于实现了这一改变.那究竟什么解耦意味着呢？好吧,各个小部件和实用程序一直被分解为单独的脚本文件.但是,页面插件负责处理自动初始化在页面创建时标记中找到的所有官方插件.这种情况使得无法在不造成错误的情况下删除不需要的插件,并且通常会为将来添加的小部件设置一个不好的先例.

现在,几乎所有jQuery Mobile库中的UI小部件都完全解耦,因此如果不需要特定项目,可以简单地删除它们.此更改允许您通过仅包含所需的特定小部件或功能集以及少数所需的核心文件来显着减小库的大小.虽然我们仍计划进行更多的解耦和清理,但现在可以解除以下文件的分离,并且可以在执行自定义构建之前安全地从make文件中删除:

• 页眉/内容/页脚
• 可折叠
• 控制组
• fieldcontain
• fixheaderfooter
• 按键
• checkboxradio
• 选择
• 滑块
• 的TextInput
• 链接主题
• 列表显示
• 导航栏
• 格

我们将在依赖关系图上工作,因为一些小部件依赖于其他工作.例如,按钮标记插件由上面的许多小部件调用,因此只能排除它,但如果您没有使用依赖于按钮的任何小部件.

我们仍在制定有关映射插件依赖关系和进一步解耦的建议.最终,这将在下载构建工具中浮出水面,敬请关注!

您可以访问他们的GIT Repo并下载您想要的内容:

• https://github.com/jquery/jquery-mobile/tree/master/js

Answer 5

如果有其他人遇到这个(并且不需要jQuery的CDN之一的文件),这里是我采取的步骤,只提取JQM事件触发器:

1. git clone git@github.com:jquery/jquery-mobile
2. cd jquery-mobile
3. 编辑js/jquery.mobile.js在编辑器
4. 用.替换define(...);语句define(['./events/touch', './events/orientationchange']);
5. make
6. 你的事件只有JQM现在compiled/jquery.mobile.js和compiled/jquery.mobile.min.js

现在你可以使用$(el).tap(fn)等而不用担心JQM劫持你的标记!

Answer 6

另一个新选择是jQuery-Mobile-Events,我一直在努力解决这个问题,只发现这个插件很有用.

来自jQuery Mobile的Download Builder的自定义构建对我来说不起作用.而jGestures没有taphold我需要的事件.