7

そのうちの1つがアクティブ化されたら、他のonclickイベントを無効にするにはどうすればよいですか。両方のdivはdisplay：noneに設定されています。CSSで。これはおそらく本当に簡単ですが、私はプログラミングに不慣れです。

HTML

<a id="leftbutton" href="#" onclick="showDiv(this.id); return false;">click me</a>
<a id="righttbutton" href="#"onclick="showDiv(this.id); return false;">click me</a>

Javascript

function showDiv(id)
{   
  if(id == "leftbutton"){
     document.getElementById('orangediv').style.display = 'block';
     }else{
     document.getElementById('greendiv').style.display = 'block';
}}
4

7 に答える 7

13

これでうまくいくはずです：

function showDiv(id)
{   
  if(id == "leftbutton"){
     document.getElementById('orangediv').style.display = 'block';
     document.getElementById('righttbutton').onclick = null;
     }else{
     document.getElementById('greendiv').style.display = 'block';
     document.getElementById('leftbutton').onclick = null;
}}
于 2012-08-14T08:17:19.513 に答える
0

たとえば、次のようになります。

function showDiv(id){   

  if  (id == "leftbutton"){
  document.getElementById('orangediv').style.display = 'block';
  document.getElementById('rightbutton').onclick = "#";
}else{
  document.getElementById('greendiv').style.display = 'block';
  document.getElementById('leftbutton').onclick = "#";
}}
于 2012-08-14T08:09:31.063 に答える
0

これらの線に沿った何か：

function showDiv(id){   
var o = document.getElementById('orangediv');
var g = document.getElementById('greendiv');
if  (id == "leftbutton"){
     o.style.display = 'block';
}else{
    g.style.display = 'block';
}
o.writeAttribute('onclick','');
g.writeAttribute('onclick','');
}
于 2012-08-14T08:11:27.883 に答える
0

他の要素のonclickプロパティをnullに設定するだけです。

if  (id == "leftbutton"){
        document.getElementById('orangediv').style.display = 'block';
        document.getElementById('righttbutton').onclick = null;
    }
    else{
        document.getElementById('greendiv').style.display = 'block';
        document.getElementById('leftbutton').onclick = null;
    }
}
于 2012-08-14T08:11:28.860 に答える
0 
function showDiv(id) {
    if ( showDiv.executed ) {
        return false;
    }

    if  ( id === "leftbutton" ) {
       document.getElementById('orangediv').style.display = 'block';
    } else {
       document.getElementById('greendiv').style.display = 'block';
    }

    showDiv.executed = true;
}

showDiv.executed = false;

このようにすると、に設定showDiv.executedするだけで、いつでも表示を再度有効にすることができますfalse。

于 2012-08-14T08:11:48.723 に答える
0

他の要素が表示されるかどうかをテストできます：

function showDiv(id)
{ 
  if  (id == "leftbutton" && (document.getElementById('greendiv').style.display == 'none'))
  {
      document.getElementById('orangediv').style.display = 'block';
  }
  else if(id == "rightbutton" && (document.getElementById('orangediv').style.display == 'none'))
  {
      document.getElementById('greendiv').style.display = 'block';
  }
}
于 2012-08-14T08:12:45.273 に答える
0

href属性をdivのidとして設定できます。これは、クリックした後に表示されます。 showDiv関数は要素全体を引数として取得でき、属性にもアクセスできます。2番目の引数は、非表示にする必要がある要素のIDにすることができます。

   <a id="leftbutton" href="orangediv" onclick="showDiv(this,'rightbutton');return false">click me</a>
   <a id="righttbutton" href="greendiv"onclick="showDiv(this,'leftbutton');return false">click me</a>

そしてjsで：

var showDiv =function(el, toHide){
  document.getElementById( el.href ).style.display = 'block';
  document.getElementById( toHide ).style.display = 'none';
  el.onclick = null; //remove onclick declaration from this anchor.

}
于 2012-08-14T08:49:10.890 に答える