後的onsubmit如何才能告訴三江源POST方法形式

我的代碼：後的onsubmit如何才能告訴三江源POST方法形式

<html> <body> 

<p>When you submit the form, a function is triggered which alerts sometext.</p> 

<form id="abc" action="https://www.w3schools.com/action_page.php" 
onsubmit="myFunction()"> Enter name: <input type="text" 
name="fname"> <input type="submit" value="Submit"> </form> 

<script> function myFunction() { 
    alert("The form was submitted"); } </script> 

</body> </html>

它運行正常，但我想提交後會顯示三江源改變形式ID，不警告，它顯示文本「謝謝你「像圖片：result

我的jsfiddle：https://jsfiddle.net/nguoicovan/adpjq8bc/

來源

2017-04-17 Xerek

使用Ajax jQuery的

<html> <body> 

<p>When you submit the form, a function is triggered which alerts sometext.</p> 

<form id="abc" action="https://www.w3schools.com/action_page.php" 
onsubmit="myFunction()"> Enter name: <input type="text" 
name="fname"> <input type="submit" value="Submit"> </form> 

<script> function myFunction() { 
    alert("The form was submitted"); } </script> 

</body> 
<script> $("#abc").submit(function(e){ 
e.preventDefault(); 
$.get("https://www.w3schools.com/action_page.php",$("#abc").serialize(),function(data){alert("Thank you for submitting ")}) 
})</script> </html>

不要忘了包括jQuery的使用它之前

來源

2017-04-17 11:13:59

可你的jsfiddle測試，代碼不運行:(並提交形式 – Xerek

你可以改變你的「行動」，以您的感謝頁面

<form action="thankyou.php">

所以，當你觸發了提交按鈕，它會去三江源.php你也可以在頁面上做你的後端功能。？

來源

2017-04-17 11:15:16

<html> 
<body> 

<div id="app"> 
<p>When you submit the form, a function is triggered which alerts some text.</p> 

    <form id="abc" action="https://www.w3schools.com/action_page.php"> 
     Enter name: <input type="text" name="fname"> 
     <input type="submit" value="Submit"> 
    </form> 
</div> 

<script 
    src="https://code.jquery.com/jquery-2.2.4.min.js" 
    integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" 
    crossorigin="anonymous"></script> 

    <script type="text/javascript"> 

    $('form#abc').on('submit', function(event){ 
     event.preventDefault(); 
     var formData = $("form#abc").serializeArray(); 
     console.log(formData); 

     $.ajax({ 
      url: "https://www.w3schools.com/action_page.php", 
      type: "POST", 
      data: formData, 
      dataType: 'jsonp', 
      crossDomain: true, 
      success:function(json){ 
      $('#app').html('<h1>Thank You</h1>'); 
      }, 
      error:function(){ 
      $('#app').html('<h1>Thank You</h1>'); 
      } 
     }); 
    });  
    </script> 
</body> 
</html>

來源

2017-04-17 11:34:51 iamkdev

當我運行你的代碼時，它不顯示三江源文本，結果是錯誤：功能您更改文本「謝謝你「to」error「查看結果 – Xerek

是的因爲'https：// www.w3schools.com/action_page.php'不會返回'jsonp'數據，所以我認爲你的url會有所不同，它會返回'json'或者'jsonp'數據 – iamkdev

我將數據更改爲「json」，但仍然出錯，但是當不使用ajax時，代碼運行正常，提交後我如何顯示thankyou？ – Xerek

後的onsubmit如何才能告訴三江源POST方法形式

回答

相關問題