如何從文本框和其他html元素的值到標籤中獲取值？

Question

嗨，我在我的應用程序中有一個表單，用戶可以放置他們的詳細信息。我的表單部分看起來像這樣，

http://jsfiddle.net/2MSXP/

在此

當上增加學校超級鏈接的用戶點擊，我要追加到標籤像所有的價值觀，

學校：12

學校名稱：St 。Xavier的

學校地點：班加羅爾

類年份：2010

科：科學

當用戶點擊添加學校超鏈接時，應該附加任何時間。

我該如何使用javascript/jquery？

Answer 1

在文本框中的值可以通過document.getElementById('id').value

訪問剩下的應該很容易爲你找出。

這裏是你如何能做到這一點不使用JQuery：

<a href="javascript:show()">Add School</a> 
    <script type="text/javascript"> 
     function show() 
     { 
      document.getElementById('result').innerHTML = "School Name: " + document.getElementById('sch1').value; 
     } 
    </script> 

添加span或DIV id爲result無論你想要的結果顯示。 展開上面的代碼以顯示其他字段。

看看這個： http://jsfiddle.net/GQdsD/

innerHTML覆蓋在他之前在HTML容器內。你可以這樣做：

document.getElementById('result').innerHTML = "School Name: " + 
document.getElementById('sch1').value + "<br/>Location: " + 
document.getElementById('schloc1').value + "<br/>Year: " + 
document.getElementById('schoolyear').value + "<br/>Branch: " + 
document.getElementById('branch1').value; 

OR，收集值在JS變種，然後將其寫入HTML容器：

var result = "School Name: " + document.getElementById('sch1').value + 
"<br/>Location: " + document.getElementById('schloc1').value + 
"<br/>Year: " + document.getElementById('schoolyear').value + 
"<br/>Branch: " + document.getElementById('branch1').value; 

document.getElementById('result').innerHTML = result; 

要允許多個補充說，在你的代碼改變這一行：

var result = "School: " + document.getElementById('schools').value + "<br/>School Name: " + document.getElementById('sch1').value + "<br/>Location: " + document.getElementById('schloc1').value + "<br/>Year: " + document.getElementById('schoolyear').value + "<br/>Branch: " + document.getElementById('branch1').value; 
      document.getElementById('result').innerHTML = result; 

對此，所以它增加了新的信息，以舊信息：

var result = document.getElementById('result').innerHTML + "<br/>School: " + document.getElementById('schools').value + "<br/>School Name: " + document.getElementById('sch1').value + "<br/>Location: " + document.getElementById('schloc1').value + "<br/>Year: " + document.getElementById('schoolyear').value + "<br/>Branch: " + document.getElementById('branch1').value; 
      document.getElementById('result').innerHTML = result; 

Answer 2

你可以添加功能按鈕，並獲得像...

$('.profileupdateBod').click(function(){ 
    $('#yourContainer').append('<div>School : '+$('select[name=schooldivision]').val()+'</div><div>School Name : '+$('#sch1').val().trim()+'</div>') 
}) 

還要檢查jQuery選擇http://api.jquery.com/category/selectors/

Answer 3

對於選擇框：

$('#select_box_id option:selected').text(); 

對於文本框：

$('#text_box_id').val();