sự kiện nhấp chuột trên thiết bị di động jquery kích hoạt hai lần

Question

Tôi gặp sự cố với một ứng dụng di động JQuery đơn giản. Tất cả điều này sẽ được ghi lại thành nhấp chuột của sự kiện nhấp hai lần.

Không có giải pháp cho vấn đề tương tự đã giải quyết vấn đề này.

Sự cố xảy ra khi triển khai thiết bị hoặc hiển thị trong trình duyệt.

Dưới đây là đoạn code

<title></title> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta name="viewport" content="width=device-width, user-scalable=no" /> 

<script src="jquery-1.8.2.min.js" type="text/javascript"></script> 
<script src="jquery.mobile-1.2.0.min.js" type="text/javascript"></script> 
<script src="cordova-2.2.0.js" type="text/javascript"></script> 

<script type="text/javascript"> 
    $(document).bind("mobileinit", function() { 
     $.support.cors = true; 
     $.mobile.allowCrossDomainPages = true; 
    }); 
</script> 

<link rel="Stylesheet" href="jquery.mobile-1.2.0.min.css" /> 

<div> 
    <input type="button" id="ButtonSubmit" value="Save" /> 
</div> 

<script type="text/javascript"> 


    $("#ButtonSubmit").click(function() { 
     alert('Clicked'); 
    }); 

</script> 

Answer 1

Bạn có thể giải quyết bằng cách sử dụng dưới đây đề cập cách.

Sử dụng trước hết unbind và sau đó bind như dưới đây :

<script type="text/javascript"> 

    $("#ButtonSubmit").unbind('click').bind('click', function() { 
      alert('Clicked'); 
      return false; //to prevent the browser actually following the links! 
     }); 

</script> 

Cập nhật: Nếu bạn gặp trên phương pháp sau đó bạn có thể sử dụng như sau.

Lưu ý: Khi bạn đang sử dụng tắt phương pháp loại bỏ nó xử lý sự kiện nhấp chuột trước và với trên phương pháp đó cho biết thêm one.B'cos mới mà nó không cho phép xảy ra bấm 2 lần.

<script type="text/javascript"> 

$('#ButtonSubmit').off('click').on('click', function(){ 

    alert('Clicked'); 
    return false; //to prevent the browser actually following the links! 
}); 

</script> 

Answer 2

Bạn đã cố gắng ngăn chặn hành động mặc định?

<script type="text/javascript"> 
    $("#ButtonSubmit").click(function (e) { 
     e.preventDefault(); 
     alert('Clicked'); 
    }); 
</script> 

Answer 3

Nếu trình xử lý onclick của bạn được kích hoạt hai lần thì có khả năng trình xử lý của bạn đang được đăng ký hai lần. Bạn có thể thêm một số đăng nhập ngay trước khi bạn đăng ký trình xử lý để xác nhận rằng đây là những gì đang xảy ra. Sau đó, bạn có thể gỡ lỗi tại sao nó được đăng ký hai lần.

Answer 4

có rất nhiều công cụ thử nghiệm diễn ra trong jQuery di động mới nhất với các sự kiện bắn nhấp chuột, đó có lẽ là gây ra các vấn đề (dòng # 2689):

// This plugin is an experiment for abstracting away the touch and mouse 
// events so that developers don't have to worry about which method of input 
// the device their document is loaded on supports. 
// 
// The idea here is to allow the developer to register listeners for the 
// basic mouse events, such as mousedown, mousemove, mouseup, and click, 
// and the plugin will take care of registering the correct listeners 
// behind the scenes to invoke the listener at the fastest possible time 
// for that device, while still retaining the order of event firing in 
// the traditional mouse environment, should multiple handlers be registered 
// on the same element for different events. 
// 
// The current version exposes the following virtual events to jQuery bind methods: 
// "vmouseover vmousedown vmousemove vmouseup vclick vmouseout vmousecancel" 

http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.js

Con đường tôi cố định nó là:

$('#mobileMenuItem').off('click'); 

và sau đó nó bắt đầu hoạt động bình thường.

Answer 5

tôi nghĩ điều này liên quan đến cách bạn xử lý các sự kiện của mình. tức là, sử dụng pageinit.

Ngoài ra một trang có url dữ liệu khác có thể bị ẩn, do đó, các js giống nhau cũng chạy không có vấn đề gì.

Trong code của bạn, tôi sẽ làm thay đổi sau

<script type="text/javascript"> 
    $(document).off('click').on('click', '#ButtonSubmit', function() { 
     alert('Clicked'); 
    }); 
</script> 

Theo cách này, tôi biết tôi sẽ ràng buộc một lần.