Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/467.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
通过一个按钮JAVASCRIPT更改多个对象上的style.display_Javascript_Styles_Event Listener - Fatal编程技术网

通过一个按钮JAVASCRIPT更改多个对象上的style.display

通过一个按钮JAVASCRIPT更改多个对象上的style.display,javascript,styles,event-listener,Javascript,Styles,Event Listener,我正在尝试使用事件侦听器通过一个按钮更改多个对象的显示属性。如果我只想一次更改一个对象上的显示,而不是所有三个对象上的显示,则效果很好 有什么想法吗 信息框#1 信息框#2 信息框#3 这些div和p标签未正确关闭。关闭这些标签,然后按预期工作 var ruta1 = document.getElementById('ruta1') var ruta2 = document.getElementById('ruta2') var ruta3 = document.getElementByI

我正在尝试使用事件侦听器通过一个按钮更改多个对象的显示属性。如果我只想一次更改一个对象上的显示,而不是所有三个对象上的显示,则效果很好

有什么想法吗


信息框#1

信息框#2

信息框#3

这些div和p标签未正确关闭。关闭这些标签,然后按预期工作

var ruta1 = document.getElementById('ruta1')
var ruta2 = document.getElementById('ruta2')
var ruta3 = document.getElementById('ruta3')

document.getElementById('knapp1').addEventListener("click", function(){
ruta1.style.display = "block";
ruta2.style.display = "none";
ruta3.style.display = "none";

});

document.getElementById('knapp2').addEventListener("click", function(){
ruta2.style.display = "block";  
ruta1.style.display = "none";
ruta3.style.display = "none";

});

document.getElementById('knapp3').addEventListener("click", function(){
ruta3.style.display = "block";
ruta1.style.display = "none";
ruta2.style.display = "none";


});
<div id="ruta1">
      <p>Informationbox #1</p>
    </div>
        <div id="ruta2">
      <p>Informationbox #2</p>
    </div>
        <div id="ruta3">
      <p>Informationbox #3</p>
    </div>