Question

<!DOCTYPE html>
<html>
    <head>
        <meta charset=utf-8 />
        <title>JS Bin</title>
    </head>
    <body>
        <form>
            <input type="text" id="song" placeholder="Enter a Song">
            <input type="button" id="button" value="Submit">
        </form>
        <ul id="songList"></ul>
    </body>
</html>

window.onload = function() {
    var button = document.getElementById("button");
    button.onclick = buttonHandler;
};

function buttonHandler(){
    var input = document.getElementById("song");
    var li = document.createElement("li");
    li = input.innerHTML;
    var ul = document.getElementById("songList");
    ul.appendChild(li);
}

上面的代码也可以在http://jsbin.com/IyaNOPa/1/edit

找到

为什么当我输入歌曲名称并单击按钮时，它是否不会将名称添加到列表中？我已经做了几次这样的事情并且它有效，现在我以不同的方式尝试它并且我不确定我的错误是什么。

Answer 1

您需要更改

 li = input.innerHTML;

到

 li.innerHTML = input.value;

您正在覆盖li以清空字符串，因为输入的innerHTML会返回给您。
您需要使用输入值的值来设置li的innerHTML。

Demo

按钮没有响应点击

1 个答案: