jQuery插件Hammer.js中触摸事件未响应AJAX。

Question

我已经在头部正确地包含了<script src="hammer.js"></script>和<script src="../jquery.hammer.js-master/jquery.hammer.js"></script>。

我的一个鼠标点击事件（动态和依赖菜单）会触发AJAX。无论我在第一个菜单上单击哪个，都会确定下一个菜单的内容。这在台式机和笔记本电脑上很好用，但在移动设备上不行。您需要在菜单上轻敲两次才能加载下一个菜单。 HTML代码：

<label> Choose a Menu:</label>
<select id="menu" name="menu" class="menu">
<option class = 'option' value = '1'>Whatsapp</option>
<option class = 'option' value = '2'>19Billion USD</option>
<option class = 'option' value = '3'>Facebook</option>
</select>
<p id = 'news'> </p>

jQuery AJAX:

$("#menu").click(function()  
{  
    var menuId = $(this).val();
    var request = $.ajax({
      url: "news.php",
      type: "POST",
      data: { id : menuId },
      dataType: "html"
    });

    request.done(function( msg ) {
      $("#news").html( msg ); 
    });
});  

Hammer.js 代码：

var element = document.getElementById('menu');
var hammertime = Hammer(element).on("tap", function(event) {
var menuId = $('#menu').val();
var request = $.ajax({
  url: "news.php",
  type: "POST",
  data: { id : menuId },
  dataType: "html"
});

request.done(function( msg ) {
  $("#news").html( msg ); 
});
});

Thank you, in advance.

- Yax

Answer 1

添加拖动和滑动事件。第一个选项卡可能被识别为拖动或滑动。

请将所有触摸事件类型打印到控制台。

var hammertime = Hammer(element).on("tap drag swipe", function(event) {

- OpenCode

Answer 2

我后来解决了这个问题，甚至没有使用 Hammer.js 。 我只是将 .click() 更改为 .change() ，现在一切都正常工作。

这是可行的代码:

$("#menu").change(function()  
{  
var menuId = $(this).val();
var request = $.ajax({
  url: "news.php",
  type: "POST",
  data: { id : menuId },
  dataType: "html"
});

 request.done(function( msg ) {
   $("#news").html( msg ); 
 });
});  

谢谢大家。

- Yax