JS事件委託中同一個標籤執行不同操作
阿新 • • 發佈：2020-07-13
JS事件委託中同一個標籤執行不同操作，根據標籤的選擇器選擇
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div id="box"> <input type="button" class="add" value="新增" /> <input type="button" class="remove" value="刪除" /> <input type="button" class="move" value="移動" /> <input type="button" class="select" value="選擇" /> </div> </body> <script> window.onload = function(){ var oBox = document.getElementById("box"); oBox.onclick = function (ev) { var ev = ev || window.event; var target = ev.target || ev.srcElement; if(target.nodeName.toLocaleLowerCase() == 'input'){ switch(target.className){ case 'add' : alert('新增'); break; case 'remove' : alert('刪除'); break; case 'move' : alert('移動'); break; case 'select' : alert('選擇'); break; } } } } </script> </html>