Javascriptを使用してPHPでフォームを送信する前に、入力値の確認を求める方法を教えてください。

Question

ユーザーがHTMLの送信ボタンをクリックすると、フォームを送信する前に入力値を指定してJavaScript確認を求める必要があります。

function ask() { 
 
    var phone = document.getElementById("phone").value; 
 
    var amount = document.getElementById("amount").value; 
 
    return confirm('Are you sure you want to send ' + amount + ' to ' + phone + '?'); 
 
}

<form method="post" action="submit.php"> 
 
    <input type="text" name="phone" id="phone" value="9999999999" /> 
 
    <input type="text" name="amount" id="amount" value="1000" /> 
 
    <input type="submit" onclick="ask()" value="Send" /> 
 
</form>

ユーザーが送信ボタンをクリックすると、それが尋ねるjavascriptの確認ダイアログが表示されるはずです「あなたは9999999999 1000を送信してもよろしいですか？」ユーザーが確認ダイアログボックスの「OK」ボタンをクリックすると、フォームが送信されます。

しかし、ユーザーが送信ボタンをクリックすると、確認を求めずに直接フォームを送信します。

助けてください！

Answer 1

機能ask()ので、確認のブール値を返しますdoesntの：ここで

function ask() { 
 
    var phone = document.getElementById("phone").value; 
 
    var amount = document.getElementById("amount").value; 
 
    return confirm('Are you sure you want to send ' + amount + ' to ' + phone + '?'); 
 
}

<form method="post" action="submit.php"> 
 
    <input type="text" name="phone" id="phone" value="9999999999" /> 
 
    <input type="text" name="amount" id="amount" value="1000" /> 
 
    <input type="submit" onclick="return ask()" value="Send" /> 
 
</form>

Answer 2

は、あなたが不足している

document.getElementById("submitForm").onsubmit = function(e) { 
 
    e.preventDefault(); 
 
    var phone = document.getElementById("phone").value; 
 
    var amount = document.getElementById("amount").value; 
 
    if(confirm('Are you sure you want to send ' + amount + ' to ' + phone + '?')) 
 
    \t { \t 
 
    \t \t document.getElementById("submitForm").onsubmit = null; 
 
    \t document.getElementById("submitForm").submit(); 
 
\t } 
 
}

<form id="submitForm" method="post" action="submit.php"> 
 
    <input type="text" name="phone" id="phone" value="9999999999" /> 
 
    <input type="text" name="amount" id="amount" value="1000" /> 
 
    <input type="submit" value="Send" /> 
 
</form>