2014-09-21 50 views
-1

我如何使用相同的div和相同的div内容和id用于不同的目的。例如:如果我创建了3年的下拉说1991,2001和2011年。然后当我点击1991年,它显示一些消息,当我点击2001年它使用相同的div内容和div ID,但显示一些其他消息。每当用户点击每年时,我都必须显示大量信息。当用户点击不同年份时,有什么方法可以覆盖同一个div吗?我如何使用相同的div id用于不同的目的

+0

此主题可能对您有用。 http://stackoverflow.com/questions/1085801/how-to-get-the-selected-value-of-dropdownlist-using-javascript – 2014-09-21 09:47:51

+0

你必须隐藏和显示div内的内容基于点击与特定的ID使用简单如果条件在JavaScript .. – 2014-09-21 09:51:32

+0

你有什么试过?代码是什么样的,它有什么问题? – 2014-09-21 13:27:19

回答

1

是的,你可以:

var mydiv = document.getElementById('divId'); 
 
var info = mydiv.getElementsByClassName('info')[0]; 
 

 
mydiv.getElementsByTagName('select')[0].addEventListener('change', function() { 
 
    if (this.value == 1) { 
 
     info.innerHTML = "This was the 1 option."; 
 
    } else if (this.value == 2) { 
 
     info.innerHTML = "This was the 2 option."; 
 
    } else if (this.value == 3) { 
 
     info.innerHTML = "This was the 3 option."; 
 
    } else { 
 
     info.innerHTML = ""; 
 
    } 
 
});
<div id="divId"> 
 
    <select> 
 
     <option value="0">choose an option</option> 
 
     <option value="1">1 option</option> 
 
     <option value="2">2 option</option> 
 
     <option value="3">3 option</option> 
 
    </select> 
 
    <div class="info"> 
 
    </div> 
 
</div>

1

如果 “mydiv” 是你div的ID:

document.getElementById("mydiv").innerHTML= "Whatever you want in the div..."; 

或者使用jQuery:

$("#mydiv").html("Whatever you want here..."); 

或者如果你不关心古代浏览器:

document.querySelector("#mydiv").innerHTML = "Whatever you want in the div..."; 
相关问题