JavaScript addEventListener無法正常工作？

Question

我創建了一個變量，該變量選擇一個#bio的ID，然后提醒該bio並獲取null值。

然后，我在生物變量中添加addEventListener，並向其添加焦點和輸入，每次輸入框出現問題時，該焦點都應運行一個名為updateCounter（）;的函數。

問題是updateCounter沒有運行。 我在Chrome中沒有任何錯誤。 任何人都可以提供解決方案並解釋我要去哪里哪里嗎？

 var bio = document.getElementById('#bio'); // <textarea> element alert(bio); addEventListener(bio, 'focus', updateCounter); // Call updateCounter() on focus addEventListener(bio, 'input', updateCounter); // Call updateCounter() on input function updateCounter(e) { alert('Update Counter ran'); } 

 <input name="title-input" id="bio" type="text" placeholder="Insert Title" /> 

Answer 1

除了某些語法錯誤外，它不起作用的主要原因是因為.addEventListener()是一種在DOM元素上運行的方法。

因此，您需要更改：

addEventListener(bio, 'focus', updateCounter);
addEventListener(bio, 'input', updateCounter);

至：

bio.addEventListener('focus', updateCounter);
bio.addEventListener('input', updateCounter);

此外，您無需在.getElementById()方法中包含#字符：

 var bio = document.getElementById('bio'); bio.addEventListener('focus', updateCounter); bio.addEventListener('input', updateCounter); function updateCounter(e) { console.log('Logging to the console.'); } 

 <input name="title-input" id="bio" type="text" placeholder="Insert Title"/> 

Answer 2

您在此處編寫的是普通JavaScript，而不是jQuery。

但是，這是一個簡單的解決方法：將沒有#的id傳遞給document.getElementById 。 您可以通過將選擇范圍調整為document.getElementById('bio')來解決此問題。 您還需要更加明確：將其設置為bio.addEventListener('focus', updateCounter); 。