JavaScript不包括在列表項

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=utf-8 /> 
<title>JS Bin</title> 
</head> 
<body> 
    <h1>Playlist</h1> 
    <form> 
    <input type="text" id="songInput" placeholder="Enter a song"> 
    <input type="button" id="songButton" value="Add to Playlist"> 
    </form> 

    <ul id="playlist"> 
    </ul> 
</body> 
</html>

上面的HTML鏈接到下面的JavaScript值：JavaScript不包括在列表項

window.onload = init; 

function init(){ 
    var button=document.getElementById("songButton"); 
    button.onclick=handleSongButtonClick; 
} 

function handleSongButtonClick(){ 
    var input = document.getElementById("songInput"); 
    var songName = songInput.value; 
    var ul = document.getElementById("playlist"); 
    var li = document.createElement("li"); 
    li.value=songName; 
    ul.appendChild(li); 
}

當我輸入一首歌曲的所有它給人的問題是什麼是子彈，沒有文本值？請幫助它可以在這裏找到http://jsbin.com/EROcOGo/2/edit

來源

2013-12-20 Justin

你會很驚訝有多少「不工作」來描述你的問題 –

列表項沒有值財產，IIRC。 – isherwood

您可以使用innerText

function handleSongButtonClick(){ 
    var input = document.getElementById("songInput"); 
    var songName = input.value; 
    var ul = document.getElementById("playlist"); 
    var li = document.createElement("li"); 
    li.innerText=songName; // Change here 
    ul.appendChild(li); 
}

Modified jsBin

來源

2013-12-20 17:23:19

使用input.value代替songInput.value;

li.innerText=songName;

，而不是

li.value=songName;

來源

2013-12-20 17:23:30

的.value屬性通常只與<form> - 相關元素有用 - <input>，<textarea>等

li.value = songName; // has no affect

要設置在其他元素中的文本內容，您可以：

集.textContent（標準）和.innerText（IE）：
```
li.textContent = li.innerText = songName; 
```

Create和append一個文本節點。

li.appendChild(document.createTextNode(songName));

來源

2013-12-20 17:23:48

+1實際解釋您的答案 –

在這裏，你就會明白：http://jsbin.com/UzeZasa/3/edit?html,js,output

首先songInput未聲明（只命名爲input 二：。value不是li屬性必須設置內-html與element.innerHTML = content。

來源

2013-12-20 17:26:32 Fabic

JavaScript不包括在列表項

回答

相關問題