С jQuery, как обнаружить/нацелить прикосновение, но не щелкнуть?

У меня есть всплывающая подсказка, которая активируется (показывается), когда целевой текст наводится. Для сенсорных устройств человек может щелкнуть целевой текст, и всплывающая подсказка отобразится, а затем, когда он коснется ПОДСКАЗКИ (не целевого текста), всплывающая подсказка скроется. Но я хочу, чтобы человек с мышью мог выбрать текст во всплывающей подсказке, проблема в том, что когда они нажимают на всплывающую подсказку, она скрывается, что является функциональностью для сенсорных устройств.

Итак, для компьютеров (с помощью мыши) я хочу, чтобы всплывающую подсказку можно было щелкнуть, не скрывая ее, но на сенсорных устройствах я хочу, чтобы всплывающая подсказка скрывалась при нажатии, чтобы упростить ее для пользователя. Надеюсь, это имеет смысл.

Как лучше всего это сделать? Есть ли способ сказать: «при прикосновении делайте это, а при нажатии (мышью) делайте то»?

http://jsfiddle.net/nicktheandroid/fdWW5/4/


click touch jquery target detect
person android.nick    schedule 05.03.2012    source источник
comment
jquerymobile.com   -  person Rizwan Mumtaz    schedule 05.03.2012

Ответы (1)


arrow_upward
2
arrow_downward

Возможно, это излишество, но вот некоторые расширения jQuery, которые я использую для облегчения сенсорных событий в браузерах:

jQuery.fn.touchstart = function (callback) {
this.each(function () {
var _self = jQuery(this);
var onTouchstart = function (ev) {
  if (ev.originalEvent) {
    if (ev.originalEvent.targetTouches) {
      AddTouchPropertiesToJQEventObject(ev);
      callback.call(this, ev);
    }
  }
};
_self.bind('touchstart', onTouchstart);
});
return this;
};

jQuery.fn.touchmove = function (callback) {
this.each(function () {
var _self = jQuery(this);
var onTouchMove = function (ev) {
  if (ev.originalEvent) {
    if (ev.originalEvent.targetTouches) {
      AddTouchPropertiesToJQEventObject(ev);
      callback.call(this, ev);
    }
  }
};
_self.bind('touchmove', onTouchMove);
});
return this;
};

jQuery.fn.touchend = function (callback) {
this.each(function () {
var _self = jQuery(this);
var onTouchEnd = function (ev) {
  var lastTouchMoveInfo = _self.data('lastTouchMoveInfo');
  ev = $.extend(ev, lastTouchMoveInfo);
  callback.call(this, ev);
};
var onTouchMove = function (ev) {
  var lastTouchMoveInfo = {
    pageX: ev.pageX,
    pageY: ev.pageY,
    touches: ev.touches
  };
  _self.data('lastTouchMoveInfo', lastTouchMoveInfo);
};
_self.touchstart(onTouchMove);
_self.touchmove(onTouchMove);
_self.bind('touchend', onTouchEnd);
});
return this;
};

var AddTouchPropertiesToJQEventObject = function (jqEventObject) {
  jqEventObject.pageX = jqEventObject.originalEvent.targetTouches[0].pageX;
  jqEventObject.pageY = jqEventObject.originalEvent.targetTouches[0].pageY;
  jqEventObject.rotation = jqEventObject.originalEvent.rotation;
  jqEventObject.scale = jqEventObject.originalEvent.scale;
  jqEventObject.targetTouches = jqEventObject.originalEvent.targetTouches;
  jqEventObject.touches = jqEventObject.originalEvent.touches;
};

В основном вы хотите привязаться к touchstart, touchmove и touchend. Или, может быть, просто touchstart за то, что вы делаете.

person JoshNaro    schedule 05.03.2012