如何使用jQuery Mobile的触摸事件支持（没有UI增强）？

我正在开发一个有自己的外观和感觉的networking应用程序。 我只想使用jQuery Mobile来支持触摸事件。

当我链接jquery.mobile.min.js（没有链接的CSS），那么我的页面的布局被打破。

我如何configuration（初始化）jQuery Mobile只使用触摸事件支持？ 我是否会绑定jQuery文档就绪钩子中的事件，因为我没有任何与JQM页面相关的事件？

编辑

在jsfiddle中看到这个例子： http : //jsfiddle.net/redhotsly/JGgrw/ 。 html包含一个<button>但jQuery Mobile在其左侧创build了一个<span> 。 如果你检查结果标记（F12），你会看到，jQuery Mobile也添加了一个CSS类到我的button。

编辑：

我需要一个解决scheme，我不会修改JQM脚本。 我需要使用CDN的官方脚本。

Answer 1

如果你只是想绑定到触摸/手势事件，我会使用jGestures来代替：

http://jgestures.codeplex.com/

很好的jquery插件，我曾经在项目中使用过大量的事件绑定到：

可用事件：

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

捏（pinch）在捏手势期间被触发（两个手指彼此远离或朝向彼此）。

旋转在旋转手势期间被触发（两个手指顺时针或逆时针旋转）。

swipemove在滑动手势（手指正在设备周围移动，例如拖动）时被触发。

swipeone在用一个接触点轻扫移动手势后触发（一个手指在设备周围移动）

swipetwo在两个接触点（两个手指在设备周围移动）的滑动手势后触发，

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

swipefour在四个触点 （四个手指在设备周围移动）的滑动手势后触发，

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

swiperightup在向右和向上轻扫移动手势之后触发

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

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

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

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

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

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

tapone在单一（一个手指）轻拍手势后触发

taptwo双击（双指）轻敲手势后触发

tapthree在三脚（三指）轻敲手势后触发

pinchopen当一个pinchopen手势（两个手指相互离开）发生，并且接触点（手指）被移除了设备时触发。

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现在有一个Download Builder，可以让你只select你想要的部分，在这种情况下，你只需要selectEvent部分下的Touchcheckbox。

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

Answer 4

jQM现在是分离的：

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

小工具：现在已经脱离了灵活的构build

我们已经想长时间将所有的小部件从页面插件中分离出来，我们很高兴地宣布我们终于实现了这一转变。 那么究竟是什么意思呢？ 那么，个别小部件和实用程序总是被分解成单独的脚本文件。 但是，页面插件负责处理在创build页面时在标记中find的所有官方插件的自动初始化。 这种情况下，不可能删除你不需要的插件而不会造成错误，而且通常为未来的widget添加设置一个不好的先例。

现在，几乎所有jQuery Mobile库中的UI小部件都是完全分离的，所以如果不需要某个特定的项目，就可以简单地将其删除。 除了less数必需的核心文件之外，此更改还使您可以显着缩小库的大小，只需包含所需的特定小组件或function集即可。 虽然我们仍然计划进行更多的解耦和清理，但在执行自定义生成之前，现在可以将以下文件解耦并可以安全地从make文件中删除：

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

我们将在依赖关系图上工作，因为一些小部件依靠其他部件来工作。 例如，button标记插件是由上面的许多小部件调用的，所以它只能被排除，但是如果你没有使用任何依赖于button的小部件。

我们仍在制定我们对插件依赖关系进行映射的build议，并进一步解耦。 最终，这将在下载构build工具中出现，敬请期待！

你可以前往他们的GIT回购，只需下载你想要的：

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

Answer 5

如果有人遇到这种情况（不需要closuresjQuery的CDN文件），下面是我提取JQM事件触发器的步骤：

1. git clone [e-mail]:jquery/jquery-mobile
2. cd jquery-mobile
3. 在你最喜欢的编辑器中编辑js/jquery.mobile.js
4. replacedefine(...); 语句define(['./events/touch', './events/orientationchange']);
5. make
6. 您的仅限事件JQM现在处于compiled/jquery.mobile.js和compiled/jquery.mobile.min.js

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

Answer 6

另一个新的select是jQuery的移动事件 ，我一直在这个问题的斗争，只发现这个插件有用。

从jQuery Mobile的下载生成器定制构build不适合我。 jGestures没有我需要的taphold事件。

Answer 7

在初始阶段处理这个特殊的问题几乎是不可能的，你最好的办法就是在UI元素上使用data-role =“none”，你不想让默认的样式发生：

 <button type="button" data-role="none">Click Me!</button>​​​​​​​​​ 

查看http://jsfiddle.net/JGgrw/13/