2

複数のaddEventListenerを実行しようとしていますが、何か問題がありますか?

たとえば、ページに3つのdivがあり、最初のdivが最初に表示され、他の2つが非表示になっているとします。

<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');
}

これが発生する理由として考えられるものは何ですか?

4

1 に答える 1

2

これを試してください。デバイスの準備ができたら、このようなバックボタンのリスナーを追加してください

var onBackButton = function(){show_div2();}; //the initial state
document.addEventListener("backbutton", onBackButton, false); 

phoneGapでonClickを使用しないでください

hrefまたはontouchendを使用し、内部に何も入っていないため、<a>が表示されていることを確認してください(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;
}
于 2012-09-28T02:16:53.413 に答える