Так как touchstart/touchhend еще не поддерживается в большинстве настольных браузеров. Как я могу создать событие touchstart, которое будет таким же, как событие mousedown (которое поддерживается во всех браузерах).
Мне нужно что-то вроде этого
$('obj').bind('touchstart', function(e){
});
будет переведен в
$('obj').bind('mousedown', function(e){
})
Вы можете связать оба сразу...
$('obj').bind('touchstart mousedown', function(e){
});
Если вы хотите mousedown событие автоматически запускать события touchstart (так что вам нужно только привязать touchstart), используйте...
$(document).bind('mousedown', function(event) {
$(event.target).trigger('touchstart');
});
Обратите внимание, что это означает, что события mousedown должны распространяться до document, прежде чем пользовательское событие touchstart может быть запущено. Это может иметь неожиданные побочные эффекты.
Попробуйте что-то вроде этого:
var clickEventType = ((document.ontouchstart!==null)?'click':'touchstart');
$('obj').bind(clickEventType, function(e){});
Еще лучше, используйте .on() для привязки:
$('body').on(clickEventType, 'obj', function(e){});
Это проверяет документ, чтобы увидеть, существует ли сенсорный старт, если это произойдет, то ваше событие будет "touchstart", если оно не (большинство настольных браузеров), а затем его 'click'.
Вы также можете инициировать использование одного и того же типа событий:
$('obj').trigger(clickEventType);
Это не самое приятное решение, но лучшее, что я нашел до сих пор. Downfall? Он работает только после первого касания, так что вы не можете использовать синхронно: (
var isTouch = false;
$('body').on('touchstart', function () {
isTouch = true;
});
Вы также можете проверить, поддерживает ли поддержка браузера сначала, например, с помощью modernizr.
Помните, что не используйте его в глобальной области (если вам не нужно). Вы также можете изменить его так, чтобы он был модернизирован, добавив класс-touch-device в тег Html, добавив после isTouch = true код: $('html').addClass('is-touch-device'). В этом случае вы можете ссылаться на него везде (из css также).