时间戳

首页 > 解决方案 > 如何完全改变 div onclick 的内容？

javascript - 如何完全改变 div onclick 的内容？

问题描述

我才刚刚开始研究 javascript，对如何使用 jQuery 并没有真正的了解，但我正在研究一个具有控制面板的页面。我试图让控制面板的功能在单击按钮时改变。

这是我到目前为止所拥有的；

html:

<div id="functions">
  <button id="prob" onclick="myproblem()" type="button" title="prob"></button>
  <button id="button1" onclick="works1()" type="button" title="button1"></button>
  <button id="button2" onclick="works2" type="button" title="button2"></button>
</div>

Javascript：

function myproblem() {
document.getElementById("functions").html('
  <button id="prob" onclick="myproblem()" type="button" title="prob"></button>
  <button id="button3" onclick="works3()" type="button" title="button3"></button>
  <button id="button4" onclick="works4()" type="button" title="button4"></button>');
}

我想用来更改 html 的按钮包含在正在更改的 div 中。在我将 myproblem() 代码写入我的 js 文件之前，该 div 中还有其他 onclick 函数工作正常。有了那段代码，我的 js 都不起作用。

这是一个本地化的页面，它不会在线。

我假设我需要使用 jQuery 来解决这个问题，但我不知道怎么做。

谢谢，

标签： javascriptjqueryhtml

解决方案

使用innerHTML()JavaScript 中的方法：

function myproblem() {
    document.getElementById("functions").innerHTML ='<button id="prob" onclick="myproblem()" type="button" title="prob"></button> <button id="button3" onclick="works3()" type="button" title="button3"></button> <button id="button4" onclick="works4()" type="button" title="button4"></button>'
}

在 Jquery 中，您可以使用该html方法

$(".functions").html('Your html code goes here')

推荐阅读