2012-05-23 30 views
11

Tôi đang xây dựng một ứng dụng cho iPhone và iPad sử dụng PhoneGap và jQMLàm thế nào để vô hiệu hóa hành vi mặc định của một Neo trong jQuery Mobile (iOS)

<div class="ui-block-a"> 
    <a id="btnLink" href="#pageID" data-role="button"></a> 
</div> 

và nó hoạt động tốt, nhưng khi tôi chạy nó trên thiết bị (không thử giả lập) và nhấn một báo dài, tôi nhận được menu iPhone mặc định cho một liên kết trong một trình duyệt bình thường để mở hoặc sao chép liên kết.

làm cách nào để tắt tính năng mặc định này trong ứng dụng của tôi?

tôi đã cố gắng những không thành công:

$("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 
}); 

nếu tôi buộc ở dưới 'taphold' Tôi vẫn thấy menu trên báo chí dài, nhưng sau khi tôi bấm hủy tôi thấy giao diện điều khiển đăng nhập: [ "ngăn chặn lâu báo chí", "taphold"]

$("a").bind('taphold', function(event) { 
console.log(['preventing long press',event.type]); 
event.preventDefault(); // long press menu still apear 
}); 

nếu tôi sử dụng đại biểu vào 'taphold' sự kiện như thế này:

$("a").delegate('taphold', function(event) { 
console.log(['preventing long press',event.type]); 
event.preventDefault(); 
}); 

sẽ sửa chữa thứ e vấn đề, nhưng tôi không thể đính kèm bất kỳ sự kiện nữa, vì vậy không các nút của tôi sẽ làm việc sau đó.

$('#btnLink').bind("click", function() { 
$.mobile.changePage('mypage', 'slide'); // won't fire any more because of the delegate before 
}); 

Tôi biết rằng đại biểu sẽ áp dụng trên tất cả các yếu tố hiện tại và trong tương lai, nhưng tôi nghĩ rằng tôi đang nhận được câu trả lời, nhưng chưa.

Cảm ơn trước

Anchor long press menu on iPhone

Trả lời

11

ok đã nhận nó để làm việc,

tôi phải kết hợp cả hai sửa mã, CSS và JavaScript

như vậy trong CSS của tôi, tôi đã làm điều này:

body { -webkit-touch-callout: none !important; } 
a { -webkit-user-select: none !important; } 

trong tôi đã JavaScript này:

function onBodyLoad() { 
    $("a").bind('taphold', function(event) { 
    event.preventDefault(); 
}); 
} 

và bây giờ tất cả các liên kết đều bị tắt, nhưng nếu tôi đính kèm sự kiện vào bất kỳ liên kết nào t sẽ làm việc với không có vấn đề

cảm ơn tất cả

+1

không 'taphold' yêu cầu jQuery mobile? –

7

Khi bạn làm $ ('a'). Click (..) bạn chỉ xử lý các sự kiện nghe tiếng 'click'. Đây là một sự kiện khác và thực sự là một sự kiện hệ thống cho iOS mà bạn không thể xử lý trong javascript.

Vì vậy, bạn sẽ phải tắt hoàn toàn tính năng này từ ứng dụng web của mình nếu bạn không muốn.

Hãy thử như sau:

<script> 
document.documentElement.style.webkitTouchCallout = 'none'; 
</script> 

Hoặc trong CSS của bạn:

a[data-role=button] { 
    -webkit-user-select: none!important; 
} 
+0

nhờ trả lời của bạn, thực sự tôi chỉ đã thử điều này và nó không hoạt động, vẫn nhận được menu trong ứng dụng của tôi trên một báo chí dài ... – EMMNS

+0

javascript hoạt động. Thay thế documentElement bằng phần tử bạn cần phải tắt kiểu dáng. – Hama

11

Hãy nhìn vào những sự kiện bị sa thải bởi JQM đây http://jquerymobile.com/demos/1.1.0/docs/api/events.html. Bạn muốn xử lý sự kiện "taphold".

EDIT Ngay sau khi đăng bài này, tôi đã thấy cùng một vấn đề trong ứng dụng của mình! Tôi thấy rằng việc thêm phong cách này, tương tự như những gì @chrisben sửa cho nó:

body { 
    -webkit-touch-callout: none !important; 
} 

tôi không có bất kỳ yếu tố hình thức trên ứng dụng của tôi vì vậy tôi không biết về những nhưng liên kết và các nút tất cả các hoạt động hoàn toàn tốt đẹp với kiểu này được thêm vào.

+0

Đã cố gắng ngăn chặn mặc định trên tabhold bằng cách sử dụng liên kết, không hoạt động nếu tôi sử dụng ủy quyền, tất cả các sự kiện và nút bấm của tôi sẽ ngừng hoạt động, ngay cả những sự kiện mà tôi đính kèm với họ sau đó, sẽ không hoạt động. chưa phải là câu trả lời cuối cùng, cảm ơn – EMMNS

+0

kiểm tra mã đã chỉnh sửa trong câu hỏi ở trên – EMMNS

3

Cách đơn giản nhất để có được điều này để làm việc trên iPhone là để vô hiệu hóa các kiểu webkit liên lạc:

document.getElementById('your element id').style.webkitTouchCallout = 'none'; 
2
<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 */ 
} 
Các vấn đề liên quan