如何从文本框和其他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();