0

AJAX (サーバーの問題!) を使用できないため、ページの 2 つの div を表示または非表示にするために DOM + JavaScript に依存する必要があります。

ユーザーが 2 つのラジオ ボタンのいずれかをクリックすると、どちらをクリックしたかに応じて、適切な div が表示されます。

「EU」ラジオボタンを使用すると、何らかの理由で最初のdivが読み込まれますが、「国際」ラジオボタンが機能しません。2 番目のボタンは正しいスクリプトを呼び出し、変数を渡し、さらに EU div を非表示にします。国際的なものは表示されません。

私は途方に暮れています。誰でも助けることができますか?

Javascript:

 function displayLocation(loc){
  alert(loc)
  document.getElementById(loc).style.display = "block"
  if (loc == "eu"){
  document.getElementById("international").style.display = "none"
  }else{
        document.getElementById("eu").style.display = "none"
  }
 }

HTMLラジオボタン

 <input type="radio" name="loc" style="float:left;" onclick=displayLocation("eu")>
 <input type="radio" name="loc" style="float:left;" onclick=displayLocation("international")>

必要に応じて非表示/表示する Div

 <div id="eu" style="display:none;">European Union</div>
 <div id="international" style="display:none;">International</div>
4

4 に答える 4

0

私が作ったばかりのフィドルを見てください。

スクリプトを呼び出すHTMLのにスクリプトを配置することで、問題を解決することができました。微調整するスタイルもいくつかありますが(onclick=displayLocation引用符で囲む必要があります)、それ以外は問題なく機能するはずです。

于 2013-03-05T14:10:05.113 に答える
0

displayLocation('xx')次のように、onlick属性で引用符をラップする必要があります。'displayLocation("eu")'

http://jsfiddle.net/rvtBp/

また、イベント属性の代わりにイベントバインディングを使用することをお勧めします。

<input type="radio" name="loc" style="float:left;" data-lang="eu">
<input type="radio" name="loc" style="float:left;" data-lang="international">

Array.prototype.forEach.call(document.querySelectorAll('[name="loc"]'),
function (elem) {
    elem.addEventListener('change', function (e) {
        if (this.checked) {
            displayLocation(this.dataset.lang);
        }
    });
});

http://jsfiddle.net/rvtBp/1/

于 2013-03-05T14:10:15.987 に答える
0
<input type="radio" name="loc" style="float:left;" onclick="displayLocation(\'' + eu + '\')">

onclick宣言は引用符で囲む必要があります。onclick="displayLocation(\'' + eu + '\')"

うまくいかないと思います。document.getElementById(loc).style.display = "block"

 document.getElementById("+loc+").style.display = "block"
于 2013-03-05T14:17:59.697 に答える
0

onclickイベントを次のように変更する必要があります

<input type="radio" name="loc" style="float:left;" onclick="displayLocation('eu')">

<input type="radio" name="loc" style="float:left;" onclick="displayLocation('international')">
于 2013-03-05T14:18:56.890 に答える