如何将文本框中的值添加到JavaScript或jQuery中的表格中？

Question

我有两个text_fields和一个table三列。通过点击按钮，我想要将这两个text_field值添加到前两列中的表中。因此，用户可以一次又一次更改text_field值，并通过单击添加button将值添加到下一行。

两个text_fields如下：

<input class="cross-reference-question-value" type="text" style="border: 1px solid gray; "> 
<input class="cross-reference-answer-value" type="text" style="border: 1px solid gray; "> 

这里是table

<table class="gridView" id="selected_units"> 
    <thead> 
    <tr class="gridViewHeader"> 
     <th>Question</th> 
     <th>Answer</th> 
     <th>Action</th> 
    </tr> 
    </thead> 

    <tbody> 
    <tr class="<%= cycle('gridViewclickableRowDialog', 'gridViewAltclickableRowDialog') %>"> 
     <td></td> 
     <td></td> 
     <td><a href="#">Delete</a></td> 
    </tr> 
    </tbody> 
</table> 

的button_link是

<a href="#" , class="button" >hello</a> 

谢谢！

Answer 1

开始尝试用这样的：

​$('.button').click(function() { 
    var question = $('.cross-reference-question-value').val(); 
    var answer = $('.cross-reference-answer-value').val(); 
    var newrow = '<tr><td>' + question + '</td><td>' + answer + '</td></tr>'; 
    $('#selected_units tr:last').after(newrow); 
});​​​​​ 

检查DEMO。添加检查空输入，重复行等。