Làm thế nào để ngăn chặn các sự kiện nhấp chuột trên cơ thể tài liệu (có thể là một lỗi trong Cordova?)

Tôi là người mới bắt đầu cố gắng phát triển trò chơi điện thoại di động với Kinetic Js và "xây dựng phonegap". Tôi đang gặp một vấn đề mà tôi không biết làm thế nào để giải quyết. tôi đã thực hiện một số xét nghiệm:Làm thế nào để ngăn chặn các sự kiện nhấp chuột trên cơ thể tài liệu (có thể là một lỗi trong Cordova?)

tôi chỉ dán this code here vào index.html của tôi và gửi mã đến phonegap build mà tạo ra các tập tin apk từ các mã html. Ứng dụng hoạt động khá tốt nhưng nếu bạn chơi một chút, bạn có thể thấy một hành vi không mong muốn: toàn bộ "giai đoạn" có thể được nhấp bằng một lần chạm và khi nó xảy ra (nó thực sự không dễ thực hiện), nhưng điều đó xảy ra) bạn nghe âm thanh nhấp chuẩn của hệ điều hành android và bạn thấy toàn bộ khu vực được đánh dấu trong một giây. Cũng giống như nếu bạn đang ở trong một trình duyệt và bạn nhấp vào một liên kết.
Tôi đã biên soạn (với bản dựng thẻ điện thoại) trình mô phỏng la bàn được liên kết here, nó hoạt động nhưng khi bạn nhấn vào pic của la bàn, bạn kích hoạt âm thanh nhấp. Đây là một hiệu ứng không mong muốn mà không có mặt nếu bạn chạy nó trên trình duyệt/trình giả lập.
Tôi chỉ cần đặt một số hình ảnh png trong cơ thể tránh canvas và KineticJs. Tôi cũng không thêm bất kỳ tập lệnh nào. Trong trường hợp này, không có sự kiện nhấp chuột nào khi bạn nhấn. Nhưng nếu tôi thêm
```
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
```
(thậm chí mà không thêm bất kỳ kịch bản) sau đó một lần nữa khai thác có thể tạo ra sự kiện click. Nếu tôi xóa bất kỳ ai trong hai dòng thì sự kiện nhấp sẽ biến mất. Ngoài ra nếu tôi thêm
```
<script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.5.4.min.js"></script> 
```
lần nữa cơ thể có thể nhấp vào sản xuất nổi bật và nhấp vào âm thanh. (Tôi vẫn đang nói về ứng dụng được biên dịch với bản dựng trên điện thoại).

Tôi đã thử thay thế <body> bằng <body onmousedown="return false;"> nhưng không được trợ giúp. Tôi cũng đã thử với $("#object").click(function() {return false;}) với phần tử div của canvas, pic và phần thân, cũng không giúp được gì. Tôi đã tìm kiếm lời khuyên để làm cho neo không thể nhấp để xem liệu chúng có thể được áp dụng hay không nhưng tôi không thấy bất kỳ điều gì hữu ích.

Bất kỳ đề xuất nào?

Cập nhật: Một lần thử khác không giải quyết được: stage.off('tap click mousedown touchstart touchend dbltap');.

Nguồn

2013-07-04 Marco Disce

Bạn đã thử ['stopPropogation'] (https://developer.mozilla.org/en-US/docs/Web/API/event.stopPropagation) và [' preventdefault'] (https: //developer.mozilla .org/en-US/docs/Web/API/event.preventDefault)? –

'preventdefault' không có khả năng hoạt động vì bạn có thể thấy nó tại nơi làm việc [ở đây] (http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_event_preventdefault) và bạn có thể kiểm tra xem hình ảnh và âm thanh hiệu ứng nhấp thực sự xảy ra. –

Tôi không chắc chắn rằng tôi phải dừng tuyên truyền của một sự kiện ở đây vì sự kiện nhấp chuột không mong muốn xảy ra dưới dạng một sự kiện duy nhất, không phải là sự tuyên truyền của một sự kiện khác. –

Bạn đã thử cái này chưa?

stage.on('tap touchstart touchend', function() { 
    return false; 
});

này có thể giúp quá:

canvas { 
    /*-webkit-tap-highlight-color: transparent; Some users reported this worked for them, although rgba(0,0,0,0); worked for the asker*/ 
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
    -webkit-touch-callout: none; 
    -webkit-user-select: none; 
    -khtml-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 
    outline: none; 
}

Dưới đây là một liên kết nhanh trên webkit-touch-callout, tôi không chắc chắn nếu nó sẽ giúp tình hình của bạn ... http://phonegap-tips.com/articles/essential-phonegap-css-webkit-touch-callout.html

EDIT: Nó xuất hiện tác giả của khoảng cách điện thoại cho thấy -webkit-tap-highlight-color: rgba(0, 0, 0, 0); để ngăn chặn lựa chọn liên kết.Nguồn ở đây: https://github.com/phonegap/phonegap-start/blob/master/www/css/index.css

Nguồn

2013-07-04 20:23:18 projeqht

Đã thử cả hai, không giải quyết được bất kỳ vấn đề nào. Preventdefault thực sự chỉ ngăn chặn hành động được kích hoạt bởi một lần nhấp, không phải là "khả năng nhấp" (xem ví dụ cách hoạt động của nó [ở đây] (http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_event_preventdefault)) –

Oh .. Hmm làm thế nào về stage.on ('tap', function() {return false;})? Xin lỗi, không dễ dàng để thử nghiệm cho tôi vì tôi chưa cài đặt máy điện thoại để thử nghiệm các bản dựng cho bạn: p – projeqht

Đã thử ngay bây giờ, không hoạt động ... cảm ơn bạn, tôi không phiền nếu bạn không làm như vậy ' t kiểm tra, tôi chỉ tìm kiếm gợi ý. –

Để vô hiệu hóa cách nhấp vào thẻ neo, bạn chỉ có thể sử dụng một số thủ thuật css, ví dụ, bạn hav một thẻ neo với lớp 'notclickable', sau đó thêm css,

.notclickable { 
    pointer-events: none; 
    cursor: default; 
    opacity:0.7; 
}

Bây giờ bạn có thể làm cho một thẻ neo vô hiệu hóa bằng cách thêm lớp này

hoặc bạn có thể thử loại này để ngăn chặn một cú nhấp chuột,

$('.notclickable').live('click', function(event){ 
    event.preventDefault(); 
});

Hope this helps.

Nguồn

2013-07-05 08:47:50

Xin chào, tôi đã cố thêm css của bạn và áp dụng lớp "không thể nhấp vào" cho một số thành phần. Nếu tôi áp dụng các lớp cho cơ thể hoặc container của sân khấu sau đó tôi không thể kéo/thả hộp nữa và thực sự tôi có thể sản xuất âm thanh nhấp vào đầu ra khai thác nó (mặc dù không có nổi bật). Nếu tôi áp dụng nó cho một văn bản trên cơ thể sau đó khi tôi bấm vào văn bản một sự kiện nhấp chuột xảy ra! Văn bản được đánh dấu và âm thanh được tạo ra. Lưu ý rằng trước khi áp dụng lớp, chạm vào văn bản đã tạo điểm đánh dấu trên toàn bộ phần thân tài liệu. –

Làm thế nào để ngăn chặn các sự kiện nhấp chuột trên cơ thể tài liệu (có thể là một lỗi trong Cordova?)

Trả lời

Các vấn đề liên quan