javascript - 如何附加带有表单数据的元素？ (查询)

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

当你返回false时，这之后的代码会被忽略，使用e.preventDefault()来避免页面重载，并且在显示的时候，你需要连接字符串和变量(在本例中为 $(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>");
    });
});