jQuery mobile listview multiple click event -


i fill list dynamically, , after on click have multiple calls of event. 1st time repeated 1 time, 2nd time 2 times, 3rd time 3 times, etc...

first, more problem can found in other answer: jquery mobile: document ready vs page events

prevent multiple event binding/triggering

because of interesting jqm loading architecture, multiple event triggering constant problem. example, take @ code snipet:

$(document).on('pagebeforeshow','#index' ,function(e,data){         $(document).on('click', '#test-button',function(e) {         alert('button click');     });     }); 

working jsfiddle example: http://jsfiddle.net/gajotres/ccfl4/

each time visit page #index click event going bound button #test-button. there few ways prevent problem:

solution 1:

remove event before bind it:

$('#index').live('pagebeforeshow',function(e,data){         $('#test-button').die().live('click', function(e) {         alert('button click');     });     }); 

working jsfiddle example: http://jsfiddle.net/gajotres/k8ymg/

in case have different events bound object:

$('#index').live('pagebeforeshow',function(e,data){         $('#test-button').die('click').live('click', function(e) {         alert('button click');     });     }); 

solution 2:

use jquery filter selector, this:

$('#carousel div:event(!click)').each(function(){     //if click not bind #carousel div }); 

because event filter not part of official jquery framework can found here: http://www.codenothing.com/archives/2009/event-filter/

in nutshell, if speed main concern solution 2 better solution 1.

solution 3:

a new one, easiest of them all.

$(document).on('pagebeforeshow', '#index', function(){            $(document).on('click', '#test-button',function(e) {         if(e.handled !== true) // prevent event triggering more once         {             alert('clicked');             e.handled = true;         }     });  }); 

working jsfiddle example: http://jsfiddle.net/gajotres/yerv9/

tnx sholsinger solution: http://sholsinger.com/archive/2011/08/prevent-jquery-live-handlers-from-firing-multiple-times/

more info

if want find more problem take @ article, working examples included.


Comments

Popular posts from this blog

blackberry 10 - how to add multiple markers on the google map just by url? -

php - guestbook returning database data to flash -

delphi - Dynamic file type icon -