addEventListener上的JavaScript自調函數

我無法生成事件監聽器自調用和監聽器工作的功能。addEventListener上的JavaScript自調函數

下面的代碼執行的功能，但該事件監聽器不工作：

window.addEventListener("resize", (function() { 
document.getElementById("divMenu").innerHTML = document.getElementById("divTop").offsetWidth 
})())

功能將設置一個需要（動態的，因爲開頭）CSS樣式的網頁格式至關重要。「調整大小」功能必須在加載時執行。是否可以做到這一點，或者我應該創建一個單獨的自我調用函數，並在事件監聽器上調用它？

來源

2016-01-27 Dillinger

什麼是使用自調用函數的目的是什麼？ – guest271314

該功能將設置一個需要的（自動開始的）動態網站格式化必不可少的CSS樣式。「調整大小」功能必須在加載時執行。 – Dillinger

當你立即調用函數時，它的返回值放在它的位置（window.addEventListener('resize', undefined)）。相反，在事件偵聽器之外定義你的函數，然後添加並調用它。

function onResize() { 
    document.getElementById('divMenu').innerHTML = document.getElementById("divTop").offsetWidth; 
} 
window.addEventListener('resize', onResize); 
onResize();

從技術上講，您可以使用自調用函數做這項工作，但它有點棘手，我不會建議它。

window.addEventListener('resize', (function onResize() { 
    document.getElementById('divMenu').innerHTML = document.getElementById("divTop").offsetWidth; 
    // Works because it returns a function 
    return onResize; 
})());

來源

2016-01-27 16:41:19

啊，很好的調用 - 很有道理，爲什麼你想在現在分配它的同時運行該功能。 –

所以邁克，你說你不能有事件監聽器的自我調用函數？詹姆斯：我編輯了我的問題以包含這些信息。 – Dillinger

@Dillinger如果自調用函數返回另一個函數或它自己，則可以。請記住：函數總是返回一個值，並且該值在作爲參數傳遞時將有效「替換」該函數。 –

你IIF返回undefined，但事件監聽必須是一個函數，或連結功能。添加返回到您的IIF或通功能：

匿名函數：

window.addEventListener("resize", function() { 
    document.getElementById("divMenu").innerHTML = document.getElementById("divTop").offsetWidth 
}))

IIF，返回功能

window.addEventListener("resize", (function() { 
return function(){ 
    document.getElementById("divMenu").innerHTML = document.getElementById("divTop").offsetWidth 
} 
})())

編輯（調用啓動時分配）：

window.addEventListener("resize", (function() { 
    function set_innerHtml(){ 
    document.getElementById("divMenu").innerHTML = document.getElementById("divTop").offsetWidth 
    } 
    set_innerHtml(); 
    return set_innerHtml; 
})())

來源

2016-01-27 16:44:46

你的答案似乎我需要，但它不是在啓動時工作，把一個警報裏面的回報功能，你會看到只彈出調整大小 – Dillinger

最後添加的代碼可能會幫助你 –

由於某種原因，我在看到自我介紹的事件聽衆時充滿了仇恨。又名：

function imAFunctionNeedlesslyAssignedGlobally(){ 
    display.textContent = input.value; 
} 
button.addEventListener('click', imAFunctionNeedlesslyAssignedGlobally); 
imAFunctionNeedlesslyAssignedGlobally();

它看起來很醜很糟糕。也許我有點挑剔，但儘管如此，我只是討厭這個以及其他解決這個問題的黑客解決方案。想到這一點後，我想出了這一點。而我的噢，我的代碼看起來好多了。

Function.prototype.runAndReturnSelf = function(){ 
    this(...arguments); 
    return this; 
}; 

button.addEventListener('click', function(){ 
    display.textContent = input.value; 
}.runAndReturnSelf());

優點：

美味簡單
精美明確
看那條匿名函數！完善範圍！
減2線的每個事件監聽器

缺點代碼：

沒有，我能馬上想到的

來源

2017-05-08 07:35:25

addEventListener上的JavaScript自調函數

回答

相關問題