jquery是一个选项吗？
我有一些div具有相同的类。当我单击其中一个div时，我想将其他div的显示更改为"block"。我目前使用的是内联javascript，但我希望不使用内联javascript。我现在拥有的：
<div class="test_a" id="example_a" onclick="testfunction(this)"></div>
<div class="test_a" id="example_b" onclick="testfunction(this)"></div>
<div class="test_a" id="example_c" onclick="testfunction(this)"></div>
<div class="test_a" id="example_d" onclick="testfunction(this)"></div>
<div class="test_a" id="example_e" onclick="testfunction(this)"></div>
<div class="test_b" id="example_a_test"></div>
<div class="test_b" id="example_b_test"></div>
<div class="test_b" id="example_c_test"></div>
<div class="test_b" id="example_d_test"></div>
<div class="test_b" id="example_e_test"></div>
我在javascript:中的函数
function testfunction(x){
var example = document.getElementById(x.id + "_test");
example.style.display = 'block';
}
因此，当您单击id为example_a的div时，我想将显示从example_a_test更改为。
工作示例：http://pastehtml.com/view/c63rmz6tw.html
现在，如何使用事件处理程序做到这一点？
这里有一个可以使用的click事件处理程序：
window.addEventListener('load', init, false);
var init = (function() {
var divs = document.getElementsByTagName('div'),
i = 0;
for (i = divs.length; i--;) {
listener(i);
}
function listener(i) {
divs[i].addEventListener('click', function(e) {
var id = this.getAttribute('id'),
idTest = id + '_test',
testElem = document.getElementById(idTest),
divClass = this.getAttribute('class');
if (divClass === 'test_a') {
testElem.style.display = 'block';
}
e.preventDefault();
});
}
});
确保在CSS中将test_b元素设置为display: none;。
这是一个jsFiddle。
$('.test_a').click(function(){
$('#' + this.id + '_test').css('display','block'); (or even .show())
});