猿问

通过单击按钮在新窗口中传递并运行 JavaScript 代码

如何使 html 按钮运行代码?

我想要做的是放一个按钮<button>打开一个新页面about:blank,并让代码在<textbox>那里。

我不知道如何使页面about:blank具有代码。我努力了:

<button src="about:blank" target"_blank" data-uri="(I don't know what to put here or if this is even correct)">Click to run code</button>

我正在尝试用 HTML 和 JS 来实现它。如果有人可以提供帮助,那就太棒了!


HUWWW
浏览 78回答 1
1回答

心有法竹

这应该适用于几乎所有的浏览器(在 FF 和 Chrome 中测试):<!-- Your link !--><a id="externalLink" href="#/">Click to run the code</a><script>&nbsp; const el = document.getElementById('externalLink');&nbsp; // Create a content for a new page with a script in it&nbsp; const newPageContent = `&nbsp; <!DOCTYPE html>&nbsp; <html>&nbsp; <head>&nbsp; &nbsp; <meta charset="UTF-8">&nbsp; &nbsp; <title></title>&nbsp; </head>&nbsp; <body>&nbsp; &nbsp; <script>alert('Hello World!')<\/script>&nbsp; &nbsp; Hello world!&nbsp;&nbsp; </body>&nbsp; </html>&nbsp; `;&nbsp; // Listen on "click" event&nbsp; el.addEventListener('click', (e) => {&nbsp; &nbsp; e.preventDefault();&nbsp; &nbsp; // Create a new window on click&nbsp; &nbsp; const w = window.open('', '_blank');&nbsp; &nbsp; // Write your content to it&nbsp; &nbsp; w.document.write(newPageContent);&nbsp; });</script>虽然我无法href="data:text/html"正常工作。我认为浏览器的某些安全规则应该禁止它。
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答