Want html form submit to do nothing

问题:

I want an html form to do nothing after it has been submitted.

action="" 

is no good because it causes the page to reload.

Basically i want an ajax function to be called whenever a button is pressed or someone hits "enter" after typing it data. Yes i could drop the form tag and add just call the function from the button's onclick event, but i also want the "hitting enter" functionality without getting all hackish.

回答1:

By using return false; in the javascript that you call from the submit button, you can stop the form from submitting.

Basically, you need the following HTML:

<form onsubmit="myFunction(); return false;">
<input type="submit" value="Submit">
</form>

Then the supporting javascript:

<script language="javascript"><!--
function myFunction() {
    //do stuff
}
//--></script>

If you desire, you can also have certain conditions allow the script to submit the form:

<form onSubmit="return myFunction();">
<input type="submit" value="Submit">
</form>

Paired with:

<script language="JavaScript"><!--
function myFunction() {
    //do stuff
    if (condition)
        return true;

    return false;    
}
//--></script>

回答2:

It also works:

<form id='my_form' action="javascript:myFunction(); return false;">

回答3:

<form id="my_form" onsubmit="return false;">

is enough ...

回答4:

How about

<form id="my_form" onsubmit="the_ajax_call_function(); return false;">
 ......
</form>

回答5:

You can use the following HTML

<form onSubmit="myFunction(); return false;">
  <input type="submit" value="Submit">
</form>

回答6:

As part of the button's onclick event return false which will stop the form from submitting.

ie:

function doFormStuff() {
    // ajax function body here
    return false;
}

And just call that function on submit button click. There are many different ways.

回答7:

use jquery. Maybe put a div around your elements from the form. Then use preventDefault() and then make your ajax calls

回答8:

<form onsubmit="return false;">

回答9:

<form action='javascript:functionWithAjax("search");'>
  <input class="keyword" id="keyword" name="keyword" placeholder="input your keywords" type="search">
  <i class="iconfont icon-icon" onclick="functionWithAjax("search");"></i>
</form>

<script type="text/javascript">
function functionWithAjax(type) {
  // ajax action

  return false;
}
</script>