javascript - 使用 Javascript onClick 更改 div 内容

标签 javascript html forms getelementbyid

我正在尝试使用文本框和提交按钮来更改页面上的 div。我想在单击按钮时获取在文本框中输入的文本并将其放入 div 中。我有这个代码:

function myfunction() { 
    var myText = document.getElementById("textbox").value;
    document.getElementById('myDiv').innerHTML = myText;
 } 
<form>
<input type="text" name="textbox" id="textbox" />
<input type="submit" name="button" id="button" onclick="myfunction()" />
</form>
<br/>
<div id="myDiv"></div>

但是什么也没发生。当我在浏览器中尝试它时,它只会刷新页面并将 ?textbox=someValueHere 添加到 URL 末尾。如何让 div 显示文本框值?

最佳答案

问题是提交按钮正在发布表单,因此您看不到更改 - 如果您将提交按钮更改为普通按钮,它将起作用

<input type="button"name="button" id="button" onclick="myfunction()" /> 

关于javascript - 使用 Javascript onClick 更改 div 内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29976206/

相关文章:

javascript - 使用 Bluebird Promise 创建节流功能

html - 将导航栏搜索表单和按钮与 Bootstrap 4 中心对齐

javascript - Html:具有固定背景的可滚动div

python - Django:带有附加字段的CreateView?

javascript - 抓取 php 中的 &lt;textarea&gt; 值(HTML 形式)

javascript - 在 HTML5、javascript/jquery 中固定/标记 map 上的多个位置

javascript - 在力有向图中突出显示节点及其邻居节点

javascript - 使用 jquery 创建动态 html 页面

javascript - 如果 Td 值不匹配,则删除整个 Tr - Javascript

jquery - 我们可以使用序列化数组从具有相同名称的多个元素中获取 id