根據用戶輸入創建段落

我遇到問題了，抓取用戶輸入，並讓onclick操作員在每次點擊後創建附加段落。根據用戶輸入創建段落

這是我的HTML代碼。

<!DOCTYPE html> 

    <html lang='en'> 
    <head> 
    <title>Add Paragraph </title> 
    <meta charset='utf-8' > 
    <script src="../js/addPara.js" type="text/javascript"></script> 
    </head> 
    <body> 
    <div> 
    <input type='text' id='userParagraph' size='20'> 
    </div> 

    <div id="par"> 

    <button id='heading'> Add your paragraph</button> 
    </div> 
    </body> 
    </html> 

Here is Javascript code: 

window.onload = function() { 
    document.getElementById("addheading").onclick = pCreate; 
}; 

    function pCreate() { 
     var userPar= document.createElement("p"); 
     var parNew = document.getElementById('userParagraph').value; 
     userPar.innerHTML = par; 
     var area = document.getElementById("par"); 
     area.appendChild(userPar); 
}

來源

2011-08-02 ProgrammingNewb

userPar.innerHTML = par;

應該

userPar.innerHTML = parNew;

來源

2011-08-02 23:42:34

還有更多問題，例如'document.getElementById（「addheading」）。onclick'應該參考'heading'。 – Shi

在您的代碼：

> window.onload = function() { 
> document.getElementById("addheading").onclick = pCreate; 
> };

如有可能（或許是可能的），一個元素不存在，最好前檢查撥打方式：

var addButton = document.getElementById("addheading"); 

    if (addButton) { 
     addButton.onclick = pCreate; 
    }

另外，沒有id爲「addheading」的元素，但有一個id爲「heading」的按鈕。

> function pCreate() { 
> var userPar= document.createElement("p"); 
> var parNew = document.getElementById('userParagraph').value; 
> userPar.innerHTML = par;

我想你的意思：

userPar.innerHTML = parNew;

，如果你不希望用戶插入隨機HTML到您的網頁（也許你這樣做），你可以把輸入文本：

userPar.appendChild(document.createTextNode(parNew));

。

> var area = document.getElementById("par"); 
> area.appendChild(userPar); 
> }

你的變量名和元素ID不要讓有很大的意義，您可能希望他們所代表的數據或者功能後，他們的名字。

來源

2011-08-03 00:48:06 RobG

根據用戶輸入創建段落

回答

相關問題