问题
uhere I upload a site for testing.
When open it click albo
than click on the two firsts names to see the popup in action (only on the two firsts because them are the only that are set), than go to stats
and scroll and click on the two blue names (same speech as before, only these ), and everything works fine.
Now try to navigate through the site/pages and you can see that not always the popups work!
I tried some times and everything works only if you follow the pages in this order: albo - stats - story, and repeat. In this way more or less always work.
But it's not good.
To achieve this I create a function and I call it on the pagecreate
of index
$(document).on('pagecreate', '#splashpage', function(){
valoripopup();
});
And this is the function
:
function valoripopup(){
var cognome, tennista;
var bgpopup = $(".bg-popup");
var close = $(".close");
var popup = $(".single-tennista-container");
$(".trigger-tennista").click(function(event){
popup = $(this).closest(".single-page").find(".single-tennista-container");
bgpopup.removeClass("outsidepopup").addClass("insidepopup");
$('html, body').on('touchmove', function(e){e.preventDefault();});
cognome = $(this).attr("data-cognome");
console.log(cognome);
for(var i=0; i<players.all.length; i++){
tennista = players.all[i];
if (cognome == tennista.cognome){
popup.empty().append(
'<a href="#" data-rel="back"><img src="images/close.png" class="close"/></a>' +
'<div class="info-popup">' +
'<div class="popup-name">' + tennista.nome + '</div>' +
'<div class="popup-cognome">' + tennista.cognome + '</div>' +
'<div class="popup-generali">' + tennista.eta + ' anni - ' + tennista.nazionalita + ' - ' + tennista.mano + '</div>' +
'</div>' +
'<div class="foto-popup"><img src="images/popup/'+ tennista.cognome + '.png" /></div>' +
'<div class="stat-popup">' +
'<div><span>'+ tennista.vittorie +'</span> <br> tornei <br>vinti</div>' +
'<div><span>'+ tennista.finali +'</span> <br> finali <br>giocate </div>' +
'<div><span>'+ tennista.partecipazioni +'</span> <br> volte <br>qualificato</div>' +
'</div>'
);
}
}
});
close.popup("close");
popup.popup({ positionTo: "window" });
popup.popup({
afterclose: function( event, ui ) {
bgpopup.removeClass("insidepopup").addClass("outsidepopup");
$('html,body').unbind('touchmove');
}
});
}
Does anyone see any mistake?
Thanks a lot!
UPDATE
Now works, but NOT if you go to previous page with the back button of the browser.
Any idea?
来源:https://stackoverflow.com/questions/26702784/jquery-mobile-popups-not-always-working