jquery evento click mobile si spegne due volte

Question

Ho un problema con una semplice app mobile JQuery. Tutto si riduce all'attivazione dell'evento click due volte.

Nessuna soluzione a problemi simili ha risolto questo problema.

Il problema si verifica se la distribuzione al dispositivo o la visualizzazione nel browser.

Ecco il codice

<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

È può risolvere che, utilizzando di seguito menzionato modo.

Usa in primo luogo unbind e poi legano come qui di seguito :

<script type="text/javascript"> 

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

</script> 

Aggiornamento: Se hai su metodo allora si potrebbe utilizzare è la seguente.

Nota: Quando si utilizza off metodo è la rimozione precedente gestore di eventi click e con sul metodo aggiunge nuove one.B'cos di che non permette che accada cliccare 2 volte.

<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

Si è tentato di impedire l'azione predefinita?

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

Answer 3

Se il gestore onclick sta sparando due volte, è probabile che il gestore venga registrato due volte. È possibile aggiungere alcune registrazioni appena prima di registrare il gestore per verificare che questo sia ciò che sta accadendo. Quindi puoi eseguire il debug perché viene registrato due volte.

Answer 4

c'è un sacco di roba sperimentale in corso negli ultimi telefoni jQuery con eventi cottura click, che è probabilmente causando questi problemi (linea # 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

Il modo in cui ho riparato era:

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

e quindi ha iniziato a funzionare normalmente.

Answer 5

Penso che questo sia legato al modo in cui gestisci i tuoi eventi. cioè, usando pageinit.

Anche una pagina con data-data diversa potrebbe essere nascosta, quindi lo stesso js viene eseguito indipendentemente da cosa.

Nel codice, vorrei fare la seguente modifica

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

In questo modo, so che legano una volta.