HTML中支持內嵌JavaScript事件子標記嗎？

在這裏，我們有一個onclick處理一個div：HTML中支持內嵌JavaScript事件子標記嗎？

<div id="BorderContainer1282" onclick="alert('hello')"> 
    <input id="Button925" type="button" value="Button"> 
</div >

當點擊它顯示一個警告對話框。

不支持HTML內嵌JavaScript同名的子標籤，就像這樣：

<div id="BorderContainer1282"> 
    <onclick>alert('hello');</onclick> 
    <input id="Button925" type="button" value="Button"> 
</div >

這個問題是不是最好的做法。具體來說，HTML支持在HTML元素的子標記中設置事件，如示例中所示。

注意：我在示例2中測試了上面的代碼，它在我的測試中不起作用。

如果它不能正常工作，會使用以下模板是一個可以接受的選擇：

<div id="BorderContainer1282"> 
    <script type="text/javascript"> 
     document.getElementById('BorderContainer1282').addEventListener("click", function(event) { 
      (function(event) { 
       alert('hello'); 
      }).call(document.getElementById("BorderContainer1282"), event); 
     }); 
    </script> 
    <input id="Button925" type="button" value="Button"> 
</div >

同樣，我現在不擔心最佳實踐，只有在支持此功能。

我發現了一個類似的問題here這不是重複的。

來源

2016-07-25 1.21 gigawatts

''標籤？作爲一個屬性，它已經很醜陋，但是...... Ps：從來沒有在HTML中看到過這個，但也許很久很久以前？ PPs：你最近的例子中'call（）'的用途是什麼？ – Kaiido

我認爲這個調用導致'this'引用引用HTML元素而不是另一個對象。 –

錯誤的猜測，'this'指的是事件已附加到的對象。在這裏你調用'undefined'（addEventListener（）'）的結果） – Kaiido

你的第二個例子是無效的HTML;沒有<onclick>標記。在第一個示例中，您能夠執行JavaScript的原因是因爲某些標記爲Event attributes。

這些屬性允許您在給定元素上觸發某個事件時執行任意JavaScript，儘管您並不關心這裏的最佳實踐，但如果要保持標記清潔和組織，則應避免使用它們。

您正在尋找的是第三個示例中的<script>標記，它允許在HTML標記中的任何位置插入JavaScript，這是您應該在這種情況下使用的。你可以使用這個標籤和addEventListener將一個事件處理程序附加到你的div。這是標籤在這種情況下的正確用法：

<div id="BorderContainer1282"> 
    <script type="text/javascript"> 
     document.getElementById("BorderContainer1282").addEventListener("click", function(e) { 
      alert("Hello!"); 
     }); 
    </script> 
    <input id="Button925" type="button" value="Button"> 
</div >

最後，<script>標籤通常放置在<body>結束，以確保腳本執行之前的所有元素都被加載。您也可以通過將您的JavaScript包裝在window.addEventListener("load", function(){ ... });中來完成此操作。

來源

2016-07-25 01:52:47 AstroCB

如果在元素被聲明爲OP之後放置腳本就沒問題。 – Kaiido

第二個示例是有效的HTML。第三個例子*已經使用了*

相關問題

HTML中支持內嵌JavaScript事件子標記嗎？

回答

相關問題