javascript - 为什么此代码无法从 HTML 文本框中获取文本并将其显示在段落中?

标签 javascript html

为什么代码不会在段落标记中显示课本中的文本?我尝试使用 onclick 命令和函数 getVal() 从文本框中获取代码,但它不起作用。

<!DOCTYPE html>
<html>
    <head>
        <title>Test</title>
        <script src="test.js">
            function getVal1(){
                var text = document.getElementById('text').value;
                var par = document.getElementById('par');
                par.innerHTML=text
            }
        </script>
    </head>
    <body>
        <form>
            <input type="text" id="text">
            <input type="submit" value="Submit" onclick="getVal1()"> 
        </form>
        <p id="par"></p>
    </body>
</html>

最佳答案

它无法工作,因为您提交了(包括重新加载)页面。 取而代之的是 input type="button"

function getVal1() {
  var text = document.getElementById('text').value;
  var par = document.getElementById('par');
  par.innerHTML = text
}
<!DOCTYPE html>
<html>

<head>
  <title>Test</title>

</head>

<body>
  <form>
    <input type="text" id="text">
    <input type="button" value="Submit" onclick="getVal1()">
  </form>
  <p id="par"></p>
</body>

</html>

关于javascript - 为什么此代码无法从 HTML 文本框中获取文本并将其显示在段落中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54934936/

相关文章:

javascript - ExtJs:如何在 html 中使用变量

javascript - 是否可以将变量从一个 innerhtml 传递到另一个 innerhtml

HTML 下拉菜单导航不显示

Javascript onchange 表单

javascript - 将谷歌可视化图表发送到电子邮件

javascript - Node.JS:使用 Express 创建新页面

javascript - 我正在尝试使用 JavaScript 在 HTML 中添加表格

javascript - 动画 Javascript classList.toggle

javascript - Angularjs。 NG-重复。一组单选按钮无法正常工作

JavaScript 还是 jquery?