如何使用表单数据附加元素？ （Jquery的）

Question

 <script>

      $(document).ready(function(){
        $('form').submit(function(){
          return false;
        $('table').append(
            `<tr>
              <td>$('#first').val();</td>
              <td>$('#last').val();</td>
             <td>$('#email').val();</td>
              <td>$('#phone').val();</td>
             </tr>`);
          });
   });
 </script>

控制台没有显示任何错误，但是当我点击提交按钮时，没有任何反应。 加载的Jquery文件是Google的托管库。使用Chrome。

Answer 1

当您return false时，忽略此后的代码，使用e.preventDefault()来避免页面重新加载，并且在显示时，您需要连接字符串和变量（在此处case为$(input).val()）以显示正确的值，例如：

$(document).ready(function(){
    $('form').submit(function(e){
        e.preventDefault();
        $('table').append("<tr><td>"+$('#first').val()+"</td><td>"
                            +$('#last').val()+"</td><td>"
                            +$('#email').val()+"</td><td>"
                            +$('#phone').val()+"</td></tr>");
    });
});