動態創建元素，但使用<a href>onClick代替按鈕</a>
[英]Dynamically create element but use <a href> instead of a button onClick
問題描述
我打算為我的表單重復使用W3Schools中描述的HTML DOM的create元素方法。
function myFunction() { var btn = document.createElement("BUTTON"); var t = document.createTextNode("CLICK ME"); btn.appendChild(t); document.body.appendChild(btn); }
<p>Click the button to make a BUTTON element with text.</p> <button onclick="myFunction()">Try it</button>
在上面的示例中， button用於創建HTML元素。 如何更改它以使用href鏈接（ <a>標簽）代替按鈕的click事件？
3 個解決方案
解決方案1
1 2015-04-29 12:13:11
您可以在引用W3Schools HTML DOM的同一示例中這樣編寫：
<!DOCTYPE html>
<html>
<body>
<p>Click the button to make a BUTTON element with text.</p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
var btn = document.createElement("a");
btn.innerHTML="click";
var t = btn.setAttribute("href","https://www.google.com");
btn.setAttribute("target","_blank");
document.body.appendChild(btn);
}
</script>
</body>
</html>
解決方案2
0 已采納 2015-04-29 12:20:27
將標記更改為錨，將href設置為“ javascript：void（0）” ，以防止瀏覽器執行導航。
<!DOCTYPE html>
<html>
<body>
<p>Click the link to make a BUTTON element with text.</p>
<a href="javascript:void(0)" onclick= "myFunction()" > Try it</a>
<script>
function myFunction() {
var btn = document.createElement("BUTTON");
var t = document.createTextNode("CLICK ME");
btn.appendChild(t);
document.body.appendChild(btn);
}
</script>
</body>
</html>
解決方案3
0 2015-04-29 12:24:08
我是否正確理解您要使用標記代替引發事件的元素的元素？
基本上，您可以像示例中那樣進行操作：
<a onclick="myFunction()">Try it</a>
您還可以給-tag一個href屬性。 但是在這里您已經看到了此“解決方案”的問題。 onclick函數和href鏈接都將被觸發，並且您肯定會有不想要的行為。
我還假設您只是希望將其設置為頁面上任何鏈接的樣式，甚至不使用href屬性。 然后使用上面的示例將起作用。 就個人而言，我仍然更喜歡使用-tag並自己設置樣式，因為該標簽僅用於鏈接。
TinyMCE-如何使用onClick代替<a href=“”>鏈接？</a>
[英]TinyMCE - how do you use onClick instead of <a href=“”> for links?
如何使用公共組件中的按鈕作為href並在React中使用onClick事件？
[英]How to use a button from common component as a href and with onClick event in react?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.
相關問題
使用onclick動態創建元素
同時使用帶 href 和 onClick 的按鈕
使用按鈕代替href觸發div
TinyMCE-如何使用onClick代替<a href=“”>鏈接？</a>
將<a href=…>onclick</a>轉換<a href=…>為按鈕</a>
動態創建 onclick 事件錨元素 - Javascript
添加onclick事件以動態創建元素
嘗試在<button>元素</button>上使用諸如href之類的東西
使用Javascript onClick事件轉到子元素的href
如何使用公共組件中的按鈕作為href並在React中使用onClick事件？
相關標簽