如何讓HTML表單的響應更新頁面上的文本？

我有一個HTML格式如下。我試圖使它成爲這個POST的響應（字符串）成爲id =「answer」的文本。如何讓HTML表單的響應更新頁面上的文本？

<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"> </script> 
    <script src="http://malsup.github.com/jquery.form.js"></script> 
    <script src="form.js"></script> 
</head> 
<body> 
    <form id="myForm" 
      action="http://myserver.com/post-destination/" 
      method="post"> 
     <p><label>Input: <br><textarea name="formInput"></textarea></label></p> 
     <p><input type="submit" value="Submit" /></p> 
    </form> 
    <p id="answer">?</p> 
</body>

我試圖使用jQuery的表格插件在一個名爲form.js文件，其中包括：

$(document).ready(function() { 
    $('#myForm') 
     .ajaxForm({ 
      target: "#answer" 
    }); 
});

我在做什麼錯在這裏？我確定這只是一個非常愚蠢的事情，我知道有很多關於HTML表單和jQuery的問題，但是跟着它們被證明是不成功的。我無法弄清楚這一點，因爲這是我第一次嘗試與網絡有關的任何事情。謝謝您的幫助！

來源

2016-07-27 screamingnugget

您的jQuery的Ajax調用似乎是不正確的。您可以重構它如下：

$(document).ready(function() { 
    $('#myForm').submit(function(e) 
{ 
    var postData = $(this).serializeArray(); 
    var formURL = $(this).attr("action"); 
    $.ajax(
    { 
     url : formURL, 
     type: "POST", 
     data : postData, 
     success:function(data, textStatus, jqXHR) 
     { 
      // set the target data 
      console.log ('set the target data'); 
     }, 
     error: function(jqXHR, textStatus, errorThrown) 
     { 
      //if fails 
      console.log ('server responded something else ...'); 
     } 
    }); 
}); 
});

來源

2016-07-27 01:42:49

Thanks！這似乎工作。我需要重寫默認行爲，所以它沒有加載新頁面，但在此之後它工作。 – screamingnugget

你可以試試這個：

<head> 
    <script> 
     function text() { 
      var answer = document.getElementById("input").value; 
      document.getElementById("answer").innerHTML = answer; 
     } 
    </script> 
</head> 
<body> 
    <form id="myForm" action="http://myserver.com/post-destination/" method="post"> 
     <p><label>Input: <br><textarea id="input" name="formInput"></textarea></label></p> 
     <p><input onClick="text()" type="submit" value="Submit" /></p> 
    </form> 
    <p id="answer">?</p> 
</body>

來源

2016-07-27 01:41:54

如何讓HTML表單的響應更新頁面上的文本？

回答

相關問題