0

我无法使用 AJAX(服务器问题!)所以我不得不依赖 DOM + javascript 来显示或隐藏我页面上的两个 div。

用户单击两个单选按钮之一,然后根据单击显示相应的 div。

出于某种原因,如果使用“欧盟”单选按钮,第一个 div 将加载,但我无法让“国际”单选按钮工作。第二个按钮调用正确的脚本,传递变量,甚至隐藏欧盟 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

你必须改变 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 回答
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 回答