覆盖PhoneGap Android中的“后退”按钮

覆盖PhoneGap Android中的“后退”按钮,第1张

概述我正在尝试完成多个addEventListener,但是出了点问题?例如,如果我们在页面上有3个div,并且第一个显示在开头,则其他两个隐藏.<divid="d1"><aonClick="document.addEventListener("backbutton",show_div1,false);$('#d1').hide();$('#d2').show();&qu

我正在尝试完成多个addEventListener,但是出了点问题?

例如,如果我们在页面上有3个div,并且第一个显示在开头,则其他两个隐藏.

<div ID="d1"><a onClick="document.addEventListener("backbutton", show_div1, false); $('#d1').hIDe();  $('#d2').show(); "</a></div><div ID="d2"></div> - initially hIDden<div ID="d3"></div> - initially hIDden

它显示div 2,隐藏div 1并将后退按钮的侦听器设置为show_div1(),一切正常.在按下返回键时,它会警告“我应该显示#div1”,因为它应该显示(// $(‘#d1’).show();被注释)

show_div1(){//$('#d1').show(); $('#d2').hIDe(); alert ('I should show #div1');}

但是现在出现了问题

<div ID="d2"><a onClick="document.removeEventListener("backbutton", show_div1, false);document.addEventListener("backbutton", show_div2, false); $('#d2').hIDe();  $('#d3').show(); "</a></div>

即使未按下后退按钮,它也会立即触发“我应该显示#div2”! addEventListener就像启动的主函数show_div2()一样,而不仅仅是在该函数的后退按钮上设置侦听器.

show_div2(){//$('#d2').show(); $('#d3').hIDe();alert ('I should show #div2');}

发生这种情况的可能原因是什么?

解决方法:

尝试这个,
准备好在设备上为此类后退按钮添加一个侦听器

var onBackbutton = function(){show_div2();}; //the initial statedocument.addEventListener("backbutton", onBackbutton, false); 

don’t use onClick with phoneGap

使用href或ontouchend,并确保您的< >可见,因为您里面没有任何东西(CSS文件中的显示块)

<div ID="d1">    <a href='JavaScript:ondivClick(1)' style='display:block; wIDth:100%; height:100%;'></a>    // <a ontouchend='ondivClick(1)'></a> will be better</div><div ID="d2">    <a href='JavaScript:ondivClick(2)' style='display:block; wIDth:100%; height:100%;'></a></div>

在JavaScript中

function ondivClick(var case){    switch(case)    case 1:        $('#d1').hIDe();          $('#d2').show();        onBackbutton = function(){show_div1();};    break;    case 2:        $('#d2').hIDe();          $('#d1').show();        onBackbutton = function(){show_div2();};    break;}
总结

以上是内存溢出为你收集整理的覆盖PhoneGap Android中的“后退”按钮全部内容,希望文章能够帮你解决覆盖PhoneGap Android中的“后退”按钮所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1094596.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-28
下一篇2022-05-28

发表评论

登录后才能评论

评论列表(0条)

    保存