JavaScript DOM 问题

[ad_1]

我正在尝试习惯 javascript DOM。
但我无法弄清楚这个问题。

该函数应该显示我输入的名字，但无论我做了什么，它都只显示你好，谁。

html代码：

<pre>
<form>
    <input type="text" placeholder="name" autocomplete="off" onkeyup="full()" id="fname">
</form>
 <p id="p"></p>

这是我的js代码。

JavaScript

var name = document.getElementById("fname");
var p = document.getElementById("p");
              function full(){
                if (name.value) {
                    p.innerHTML = "hello, ${name.value}";
                    console.log(1);
                }
                else {
                    p.innerHTML = "hello, who";
                    console.log(2);
                }
              }

我尝试过的：

我将事件从 oninput 更改为 onkeyup，但得到了相同的结果。

解决方案1

第一个问题是您使用的是常规字符串而不是模板文字[^]。

第二个问题是 name 是位于 window 目的。当事件处理函数被调用时，该属性隐藏 name 多变的。将您的变量更改为类似的内容 fname 反而。

JavaScript

const fname = document.getElementById("fname");
const p = document.getElementById("p");

function full() {
    if (fname.value) {
        p.innerHTML = `hello, ${fname.value}`;
    } else {
        p.innerHTML = "hello, who";
    }
}