1. 程式人生 > >addEventListener繫結帶參函式

addEventListener繫結帶參函式

因為以前一直使用的jquery,然後剛剛在使用原生dom繫結帶參的時候出現了一些問題。

初始程式碼片段

<button class="addEvent">繫結事件</button>

<script>
    const addEvent = document.querySelector('.addEvent')
    addEvent.addEventListener('click',log('繫結事件'))
    function log(msg){
        console.log(msg)
    }
</script
>

問題:1、log()初始自執行了;2、button沒繫結上這個點選事

後來找資料才找到原因:addEventListener第二個引數接收的是個function,在觸發時執行的。你一定要把某個引數傳到這個function裡的話,用閉包返回一個function

正確寫法

function log(msg){
    return function(e){
       console.log(msg)
       //to do
    }
}