С помощью jQuery как определить / нацелить касание, но не щелкнуть мышью? - PullRequest
Новая
       27

С помощью jQuery как определить / нацелить касание, но не щелкнуть мышью?

1 голос
/ 05 марта 2012

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

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

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

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

1 Ответ

2 голосов
/ 05 марта 2012

Это, вероятно, излишне, но вот некоторые расширения 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 за то, что вы делаете.

...