这是我的 HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel = "stylesheet" type="text/css" href="styles/css/style.css" />
</head>
<body>
<div>
<select class="option_block" size="5" multiple="1">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<option>Option 4</option>
<option>Option 5</option>
</select>
<div class="button_block" multiple="1">
<button class="move_button" id="MoveAllToRight">>></button>
<button class="move_button" id="MoveToRight">></button>
<button class="move_button" id="MoveToLeft"><</button>
<button class="move_button" id="MoveAllToLeft"><<</button>
</div>
<select class="option_block" size="5"></select>
</div>
<script src="scripts/javascript/script.js"></script>
</body>
</html>
Adh 这是我的 JS 脚本:
(function(){
function move(direction) {
..........
}
function moveAll(direction) {
...........
}
document.getElementById("MoveAllToRight").addEventListener("click", function () {
moveAll('ToRight');
});
document.getElementById("MoveToRight").addEventListener("click", function () {
move('ToRight');
});
document.getElementById("MoveToLeft").addEventListener("click", function () {
move('ToLeft');
});
document.getElementById("MoveAllToLeft").addEventListener("click", function () {
moveAll('ToLeft');
});
})();
我决定不显示 move 和 moveAll 函数的内容，因为这显然是过多的信息。
如何访问包含 move 和 moveAll 函数中两个元素的“div”？
我有一个使用“ID”的解决方案，但它不可扩展。
最佳答案
document.getElementById("MoveAllToRight").addEventListener("click", function(event) {
moveAll(event, 'ToRight');
});
函数 event.target 内将显示调用事件的元素。
关于javascript - 如何找出调用函数的元素(Javascript)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36970673/