jquery.ui.touch.punch.js脚本阻止了触摸设备上的输入功能

Question

它花了我一点点,但我发现我无法点击我的输入,因为我正在使用touch.punch脚本在触摸设备上启用jquery UI拖动功能.熟悉这个脚本的人知道为什么会这样吗？表单实际上位于父对象的树下.有没有人知道我可以覆盖或强制选择的方式？我将尝试绑定事件,立即强制关注输入,但也许有人在这里有一些见解？

Answer 1

JEdi​​table + jQuery UI Sortable + jquery.ui.touch-punch

我整天都在研究这个问题,最后我找到了解决方案.解决方案与kidwon的答案非常相似.但是,我使用的是jeditable,它动态创建没有类名的输入字段.所以我使用这个条件语句而不是检查类名:

//Check if element is an input or a textarea
if ($(touch.target).is("input") || $(touch.target).is("textarea")) {
  event.stopPropagation();
} else {
  event.preventDefault();
}

我认为这是一个更好的解决方案,因为它始终使用任何输入或textarea字段的本机功能.

Answer 2

伙计们,这里的另外两个答案对我不起作用,但Danwilliger的解决方案有效; 然而,从他的回答中不清楚如何在Touch Punch JS文件中设置它.对于未来的求职者,这里是做什么的.再一次,这是Danwilliger的解决方案 - 我只是澄清一下.

在jquery.ui.touch-punch.js中更改此部分(在第30行左右):

function simulateMouseEvent (event, simulatedType) {

// Ignore multi-touch events
if (event.originalEvent.touches.length > 1) {
  return;
}

event.preventDefault();

var touch = event.originalEvent.changedTouches[0],
    simulatedEvent = document.createEvent('MouseEvents');

对此:

function simulateMouseEvent (event, simulatedType) {

// Ignore multi-touch events
if (event.originalEvent.touches.length > 1) {
  return;
}
var touch = event.originalEvent.changedTouches[0],
    simulatedEvent = document.createEvent('MouseEvents');

//Check if element is an input or a textarea
if ($(touch.target).is("input") || $(touch.target).is("textarea")) {
    event.stopPropagation();
} else {
    event.preventDefault();
}

祝你好运!

Answer 3

对于任何可能使用非常方便的touch.punch黑客在类似情况下结束的人,只需强制关注点击事件就可以正常工作!

$('.input').bind('click', function(){
    $(this).focus();
});