顯示一個Javascript函數的結果

我試圖獲得一個javascript函數來打印出來，但沒有出現。本質上，我只是設置一個文本框，單選按鈕和複選框的基本頁面供用戶填寫，這些元素的結果將打印出來以創建一個基本的準系統檔案頁面。顯示一個Javascript函數的結果

對於任何草率或過時的編碼，我都會提前道歉，我開始使用這些東西（我在網頁設計中的第一個學期）。我假設我已經犯了一個小錯誤，我沒有捕捉到這與代碼的其餘部分搞砸了，或者我只是簡單地遺漏了一行關鍵代碼。

這裏的下面（JavaScript）的代碼： `

function validate() 
{ 
    dataOut = document.getElementById("profileOut"); 

    var color = document.profileIn.bgcolor.value; 
    style.backgroundColor = color; 

    var border = document.profileIn.border.value; 
    style.border = border; 

    var name = document.profileIn.name.value; 
    dataOut.innerHTML = "<h1 id='name'>" name "</p>"; 

    if (document.GetElementById('sportsgames').checked { 
     dataOut.innerHTML = "<img src='images/sportsgames.jpg' alt='I like sports and games' />"; 
    } else if (document.GetElementById('tvfilm').checked { 
     dataOut.innerHTML = "<img src='images/tvfilm.jpg' alt='I like tv and film' />"; 
    } else if (document.GetElementById('artlit').checked { 
     dataOut.innerHTML = "<img src='images/artlit.jpg' alt='I like art and literature' />"; 
    } else { 
     dataOut.innerHTML = "<img src='images/nothing.jpg' alt='I hate everything' />"; 
    } 

    var entry1 = document.profileIn.entry1.value; 
    dataOut.innerHTML = "<p id='para1'>" entry1 "</p>"; 
    document.getElementById("para1").style.color="#0000FF"; 
    var entry2 = document.profileIn.entry2.value; 
    dataOut.innerHTML = "<p id='para2'>" entry2 "</p>"; 
    document.getElementById("para2").style.color="#FF0000"; 

    var years = document.profileIn.years.value; 
    dataOut.innerHTML = "<p>I have been practicing this hobby for " + years + " years.</p>"; 

    var music = document.profileIn.music.value; 
    dataOut.innerHTML = "<p> My favorite music genre is " + music + ".</p>"; 

    var birthday = document.profileIn.birthday.value; 
    dataOut.innerHTML = "<p>Birthday:" + music + "</p>"; 

    var email = document.profileIn.email.value; 
    dataOut.innerHTML = "<p> E-Mail:" + music + "</p>"; 

    var website = document.profileIn.website.value; 
    dataOut.innerHTML = "<p>Website:" + music + "</p>"; 

    document.getElementById('profileOut').innerHTML = profileOut; 
} 

</script>`

和HTML代碼，以及：

<body id="profile"> 
<form id="profileIn" name="profileIn" method="post" onSubmit="return validate()"> 
    <fieldset id ="set1"> 
     <legend>Your Page</legend> 
     <label for="bgcolor"> 
     <input type="color" id="bgcolor" name="bgcolor" value="#FFFFFF" /> Select a background color<br> 

     Choose the thickness of the border<br> 
     <input type="range" id="border" name="border" value="5" min="0" max="10" step="1" /><br> 
     0 1 2 3 4 5 6 7 8 9 10 
    </fieldset> 

    <fieldset id="set2"> 
     <legend>Your Profile</legend> 
     Enter your name <input type="text" id="name" name="name" /> <br> 

     Enter your favourite hobby <br> 
     <input type="radio" id="sportsgames" name="hobby" value="sportsgames">Sports & Games<br> 
     <input type="radio" id="tvfilm" name="hobby" value="tvfilm">TV & Film<br> 
     <input type="radio" id="artlit" name="hobby" value="artlit">Art & Literature<br><br> 

     <label for="entry">What part of that hobby is your favourite?</label><br> 
     <textarea id="entry1" name="comments1" rows="8" cols="50">Type in here...</textarea><br>  

     <label for="entry">Which part of that hobby are you best at?</label><br> 
     <textarea id="entry2" name="comments2" rows="8" cols="50">Type in here...</textarea><br> 

     How many years have you practiced this hobby? <br> 
     <input id="years" type="number" name="years" value="0" min="1" max="100" /><br> 

     What's your favorite genre of music? <br> 
     <select id="music"> 
     <option value="Rock">Rock<option> 
     <option value="Pop">Pop<option> 
     <option value="Country">Country<option> 
     <option value="R&B">R&amp;B<option> 
     <option value="Classical">Classical<option> 
     </select> 
    </fieldset> 

    <fieldset id="set3"> 
     <legend>Your Info</legend> 
     Birthday <input id="birthday" type="date" name="date" /> <br> 
     Email <input id="email" name="email" type="email" placeholder="[email protected]" /> <br> 
     Website <input id="website" name="website" type="url" placeholder="www.example.com" /> 
    </fieldset> 

    <fieldset id="set4"> 
     <input class="btn" type="submit" id="btn1" value="Press to Continue" /> 
     <input class="btn" type="reset" id="btn2" value="Press to Clear" /> 
    </fieldset> 
</form> 

<section id="profileOut"> </section>

任何幫助的感激，謝謝你們！

來源

2014-04-14 CSRadical

Javascript區分大小寫，使用'getElementById'（使用小寫'g'）時一致。 – adeneo

getElementById - 您拼寫錯誤。沒有資本G – Fuzzyma

下面的線條不正確。在Javascript中，追加應該用+完成。

dataOut.innerHTML = "<h1 id='name'>" name "</p>";

應該

dataOut.innerHTML = "<h1 id='name'>" + name + "</p>";

來源

2014-04-14 13:19:43 Rajesh

你得到在控制檯的任何錯誤？（瀏覽器中的F12）。此外，回報是沒有必要的，據我所知：

onSubmit="return validate()">

可以只是：

onSubmit="validate()">

來源

2014-04-14 13:20:55

經常檢查你的瀏覽器控制檯中的錯誤。粗略一瞥透露：

dataOut.innerHTML = "<p id='para1'>" entry1 "</p>";

這裏缺少連接運算符。

一般來說，不過，你似乎在反覆重寫dataOut.innerHTML，這 - 假設你的代碼是正確的 - 只會導致「網站：嗒嗒」而已。考慮使用createElement創建一個元素，向其添加文本（createTextNode,appendChild），然後插入它。

來源

2014-04-14 13:21:03

第一個錯誤：

dataOut.innerHTML = "<h1 id='name'>"+name+"</p>"; //Missing +

第二至第四

if (document.GetElementById('sportsgames').checked) //Missing)

第五錯誤：

dataOut.innerHTML = "<p id='para1'>"+entry1+"</p>"; //Missing +

第六錯誤：

dataOut.innerHTML = "<p id='para2'>"+entry2+"</p>"; //Missing +

來源

2014-04-14 13:21:33 schnawel007

你忘了串聯（+）你的一些變量來你的字符串，如姓名，entry1，entry2等

經常檢查你的開發者控制檯，如果你的一些JavaScript代碼是行不通的。

來源

2014-04-14 13:25:19 Nimrod

顯示一個Javascript函數的結果

回答

相關問題