JavaScript Form Submit - Confirm or Cancel Submiss

2018-12-31 20:45发布

问题:

For a simple form with an alert that asks if fields were filled out correctly, I need a function that does this:

  • Shows an alert box when button is clicked with two options:

    • If \"OK\" is clicked, the form is submitted
    • If cancel is clicked, the alert box closes and the form can be adjusted and resubmitted

I think a JavaScript confirm would work but I can\'t seem to figure out how.

The code I have now is:

<script>
function show_alert() {
   alert(\"xxxxxx\");
}
</script>
<form>
   <input type=\"image\" src=\"xxx\" border=\"0\" name=\"submit\" onclick=\"show_alert();\"
      alt=\"PayPal - The safer, easier way to pay online!\" value=\"Submit\">
</form>

回答1:

A simple inline JavaScript confirm would suffice:

<form onsubmit=\"return confirm(\'Do you really want to submit the form?\');\">

No need for an external function unless you are doing validation, which you can do something like this:

<script>
function validate(form) {

    // validation code here ...


    if(!valid) {
        alert(\'Please correct the errors in the form!\');
        return false;
    }
    else {
        return confirm(\'Do you really want to submit the form?\');
    }
}
</script>
<form onsubmit=\"return validate(this);\">


回答2:

function show_alert() {
  if(confirm(\"Do you really want to do this?\"))
    document.forms[0].submit();
  else
    return false;
}


回答3:

You could use the JS confirm function.

<form onSubmit=\"if(!confirm(\'Is the form filled out correctly?\')){return false;}\">
  <input type=\"submit\" />
</form>

http://jsfiddle.net/jasongennaro/DBHEz/



回答4:

<form onsubmit=\"return confirm(\'Do you really want to submit the form?\');\">


回答5:

OK, just change your code to something like this:

<script>
function submit() {
   return confirm(\'Do you really want to submit the form?\');
}
</script>

<form onsubmit=\"return submit(this);\">
   <input type=\"image\" src=\"xxx\" border=\"0\" name=\"submit\" onclick=\"show_alert();\"
      alt=\"PayPal - The safer, easier way to pay online!\" value=\"Submit\">
</form>

Also this is the code in run, just I make it easier to see how it works, just run the code below to see the result:

function submitForm() {
  return confirm(\'Do you really want to submit the form?\');
}
<form onsubmit=\"return submitForm(this);\">
  <input type=\"text\" border=\"0\" name=\"submit\" />
  <button value=\"submit\">submit</button>
</form>