Я создаю приложение для iPhone и iPad с помощью PhoneGap и jQM
<div class="ui-block-a">
<a id="btnLink" href="#pageID" data-role="button"></a>
</div>
и он работает нормально, но когда я запускаю его на устройстве (не пробовал симулятор) и нажимаю длинное нажатие, я получаю меню iPhone по умолчанию для ссылки в обычном браузере, чтобы открыть или скопировать ссылку.
как отключить эту функцию по умолчанию в моем приложении?
Я пробовал их без успеха:
$("a").click(function(event) {
event.preventDefault(); // long press menu still apear
});
$("a").bind('click',function(event) {
console.log(['preventingclick',event.type]);
event.preventDefault(); // long press menu still apear
});
если я привяжусь к 'taphold', я все еще вижу меню при длинном нажатии, но после того, как я нажал кнопку "Отмена", я вижу журнал консоли: [ "Предотвращение длительного нажатия", "taphold" ]
$("a").bind('taphold', function(event) {
console.log(['preventing long press',event.type]);
event.preventDefault(); // long press menu still apear
});
если я использую делегат в событии 'taphold' следующим образом:
$("a").delegate('taphold', function(event) {
console.log(['preventing long press',event.type]);
event.preventDefault();
});
устранит проблему, но я больше не могу присоединять какие-либо события, поэтому после этого мои функции не будут работать.
$('#btnLink').bind("click", function() {
$.mobile.changePage('mypage', 'slide'); // won't fire any more because of the delegate before
});
Я знаю, что делегат будет применяться ко всем элементам сейчас и в будущем, но я думаю, что приближаюсь к ответу, но пока не готов.
Заранее спасибо
ok заставил его работать,
Мне пришлось объединить оба исправления кода, CSS и JavaScript
поэтому в моем CSS я сделал это:
body { -webkit-touch-callout: none !important; }
a { -webkit-user-select: none !important; }
в моем JavaScript сделал это:
function onBodyLoad() {
$("a").bind('taphold', function(event) {
event.preventDefault();
});
}
и теперь все ссылки отключены, но если я присоединю какое-либо событие к любому из них, он будет работать без проблем
Чрезвычайно все
Посмотрите на события, выпущенные JQM здесь http://jquerymobile.com/demos/1.1.0/docs/api/events.html. Вы хотите обработать событие "taphold".
ИЗМЕНИТЬ Вскоре после публикации этого вопроса я обнаружил ту же проблему в своем приложении! Я обнаружил, что добавление этого стиля, похожее на то, что предложил @chrisben, исправляет его:
body {
-webkit-touch-callout: none !important;
}
У меня нет элементов формы в моем приложении, поэтому я не знаю о них, но ссылки и кнопки работают отлично, добавив этот стиль.
Когда вы делаете $('a'), нажмите (..), вы обрабатываете только событие 'click'. Здесь это другое событие и фактически системное событие для iOS, которое вы не можете обрабатывать в javascript.
Таким образом, вам придется отключить эту функцию полностью из вашего webapp, если вы этого не хотите.
Попробуйте следующее:
<script>
document.documentElement.style.webkitTouchCallout = 'none';
</script>
Или в вашем CSS:
a[data-role=button] {
-webkit-user-select: none!important;
}
Самый простой способ заставить это работать на iPhone - отключить стили сенсорного интерфейса webkit:
document.getElementById('your element id').style.webkitTouchCallout = 'none';
<style type="text/css">
*:not(input):not(textarea) {
-webkit-user-select: none; /* disable selection/Copy of UIWebView */
-webkit-touch-callout: none; /* disable the IOS popup when long-press on a link */
}
</style>
**If you want Disable only anchor button tag use this.**
a {-webkit-user-select: none; /* disable selection/Copy of UIWebView */
-webkit-touch-callout: none; /* disable the IOS popup when long-press on a link */
}