blocks|key|871737|text|你最好做……|type|unstyled|depth|inlineStyleRanges|entityRanges|data|871738|<form+onsubmit="return+isValidForm()"+/>|code-block|syntax|javascript|871739|如果isValidForm()返回false，则您的表单不会提交。|offset|length|style|CODE|871740|您可能还应该将事件处理程序从内联中移出。|871741|document.getElementById('my-form').onsubmit+=+function()+{
++++return+isValidForm();
};|871742|entityMap^0|0|0|2|D|H|5|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@$I|V|J|W|K|L]|$I|X|J|Y|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|Z|8|@]|9|@]|A|$]]|$1|O|3|P|5|D|7|10|8|@]|9|@]|A|$E|F]]|$1|Q|3|-4|5|6|7|11|8|@]|9|@]|A|$]]]|R|$]]

<p>You are better off doing...</p>

<pre><code>&lt;form onsubmit="return isValidForm()" /&gt;
</code></pre>

<p>If <code>isValidForm()</code> returns <code>false</code>, then your form doesn't submit.</p>

<p>You should also probably move your event handler from inline.</p>

<pre><code>document.getElementById('my-form').onsubmit = function() {
    return isValidForm();
};
</code></pre>


blocks|key|1086366|text|将您的输入更改为：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1086367|<input+type='submit'+value='submit+request'+onclick='return+btnClick();'>|code-block|syntax|javascript|1086368|并在您的函数中返回false|1086369|function+btnClick()+{
++++if+(!validData())
++++++++return+false;
}|1086370|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>Change your input to this:</p>

<pre><code>&lt;input type='submit' value='submit request' onclick='return btnClick();'&gt;
</code></pre>

<p>And return false in your function</p>

<pre><code>function btnClick() {
    if (!validData())
        return false;
}
</code></pre>


blocks|key|1086324|text|你需要改变|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1086325|onclick='btnClick();'|code-block|syntax|javascript|1086326|至|1086327|onclick='return+btnClick();'|1086328|和|1086329|cancelFormSubmission();|1086330|1086331|return+false;|1086332|也就是说，我会尽量避免固有的事件属性，转而使用具有良好事件处理API的库(如YUI或jQuery)，并绑定到真正重要的事件(即表单的提交事件，而不是按钮的单击事件)。|1086333|entityMap^0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|V|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|W|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|X|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|Y|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|Z|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|10|8|@]|9|@]|A|$E|F]]|$1|O|3|H|5|6|7|11|8|@]|9|@]|A|$]]|$1|P|3|Q|5|D|7|12|8|@]|9|@]|A|$E|F]]|$1|R|3|S|5|6|7|13|8|@]|9|@]|A|$]]|$1|T|3|-4|5|6|7|14|8|@]|9|@]|A|$]]]|U|$]]

<p>You need to change</p>

<pre><code>onclick='btnClick();'
</code></pre>

<p>to</p>

<pre><code>onclick='return btnClick();'
</code></pre>

<p>and</p>

<pre><code>cancelFormSubmission();
</code></pre>

<p>to</p>

<pre><code>return false;
</code></pre>

<p>That said, I'd try to avoid the intrinsic event attributes in favour of <a href="http://en.wikipedia.org/wiki/Unobtrusive_JavaScript" rel="noreferrer">unobtrusive JS</a> with a library (such as YUI or jQuery) that has a good event handling API and tie into the event that really matters (i.e. the form's submit event instead of the button's click event).</p>


blocks|key|1086677|text|有时onsubmit不能与asp.net一起工作。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1086678|我用非常简单的方法解决了这个问题。|1086679|如果我们有这样的表单|1086680|<form+method="post"+name="setting-form"+>
+++<input+type="text"+id="UserName"+name="UserName"+value=""+
++++++placeholder="user+name"+>
+++<input+type="password"+id="Password"+name="password"+value=""+placeholder="password"+>
+++<div+id="remember"+class="checkbox">
++++<label>remember+me</label>
++++<asp:CheckBox+ID="RememberMe"+runat="server"+/>
+++</div>
+++<input+type="submit"+value="login"+id="login-btn"/>
</form>|code-block|syntax|javascript|1086681|现在，您可以在窗体回发之前捕获、获取该事件，并从回发中停止它，然后使用此jquery执行您想要的所有ajax操作。|1086682|$(document).ready(function+()+{
++++++++++++$("#login-btn").click(function+(event)+{
++++++++++++++++event.preventDefault();
++++++++++++++++alert("do+what+ever+you+want");
++++++++++++});
+});|1086683|entityMap^0|2|8|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|X|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|Y|8|@]|D|@]|E|$]]|$1|J|3|K|5|L|7|Z|8|@]|D|@]|E|$M|N]]|$1|O|3|P|5|6|7|10|8|@]|D|@]|E|$]]|$1|Q|3|R|5|L|7|11|8|@]|D|@]|E|$M|N]]|$1|S|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|T|$]]

<p>Sometimes <code>onsubmit</code> wouldn't work with asp.net.</p>

<p>I solved it with very easy way.</p>

<p>if we have such a form</p>

<pre><code>&lt;form method="post" name="setting-form" &gt;
   &lt;input type="text" id="UserName" name="UserName" value="" 
      placeholder="user name" &gt;
   &lt;input type="password" id="Password" name="password" value="" placeholder="password" &gt;
   &lt;div id="remember" class="checkbox"&gt;
    &lt;label&gt;remember me&lt;/label&gt;
    &lt;asp:CheckBox ID="RememberMe" runat="server" /&gt;
   &lt;/div&gt;
   &lt;input type="submit" value="login" id="login-btn"/&gt;
&lt;/form&gt;
</code></pre>

<p>You can now catch get that event before the form postback and stop it from  postback and do all the ajax you want using this jquery.</p>

<pre><code>$(document).ready(function () {
            $("#login-btn").click(function (event) {
                event.preventDefault();
                alert("do what ever you want");
            });
 });
</code></pre>


blocks|key|871802|text|您应该将类型从submit更改为button|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|871803|<input+type='button'+value='submit+request'>|code-block|syntax|javascript|871804|而不是|871805|<input+type='submit'+value='submit+request'>|871806|然后，您可以在javascript中获取按钮的名称，并将您想要的任何操作与之相关联|871807|var+btn+=+document.forms["frm_name"].elements["btn_name"];
btn.onclick+=+function(){...};|871808|对我很有效，希望它能帮上忙。|871809|entityMap^0|7|6|G|6|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]|$9|Z|A|10|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|11|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|12|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|13|8|@]|D|@]|E|$I|J]]|$1|O|3|P|5|6|7|14|8|@]|D|@]|E|$]]|$1|Q|3|R|5|H|7|15|8|@]|D|@]|E|$I|J]]|$1|S|3|T|5|6|7|16|8|@]|D|@]|E|$]]|$1|U|3|-4|5|6|7|17|8|@]|D|@]|E|$]]]|V|$]]

<p>you should change the type from <code>submit</code> to <code>button</code>:</p>

<pre><code>&lt;input type='button' value='submit request'&gt;
</code></pre>

<p>instead of</p>

<pre><code>&lt;input type='submit' value='submit request'&gt;
</code></pre>

<p>you then get the name of your button in javascript and associate whatever action you want to it</p>

<pre><code>var btn = document.forms["frm_name"].elements["btn_name"];
btn.onclick = function(){...};
</code></pre>

<p>worked for me
hope it helps.</p>


blocks|key|871744|text|你需要return+false;|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|871745|<input+type='submit'+value='submit+request'+onclick='return+btnClick();'+/>

function+btnClick()+{
++++return+validData();
}|code-block|syntax|javascript|871746|entityMap^0|3|D|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

<p>You need to <code>return false;</code>:</p>

<pre><code>&lt;input type='submit' value='submit request' onclick='return btnClick();' /&gt;

function btnClick() {
    return validData();
}
</code></pre>


blocks|key|1086417|text|为什么不将submit按钮更改为常规按钮，并在单击事件中，如果表单通过验证测试，则提交表单？|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1086418|e.g|1086419|<input+type='button'+value='submit+request'+onclick='btnClick();'>

function+btnClick()+{+
++++if+(validData())+
++++++++document.myform.submit();
}+|code-block|syntax|javascript|1086420|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>Why not change the submit button to a regular button, and on the click event, submit your form if it passes your validation tests?</p>

<p>e.g</p>

<pre><code>&lt;input type='button' value='submit request' onclick='btnClick();'&gt;

function btnClick() { 
    if (validData()) 
        document.myform.submit();
} 
</code></pre>


blocks|key|871852|text|这很简单，只需返回false即可；|type|unstyled|depth|inlineStyleRanges|entityRanges|data|871853|下面的代码使用jquery在提交按钮的onclick中。|871854|if(conditionsNotmet)
{
return+false;
}|code-block|syntax|javascript|871855|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>It's simple, just return false;</p>

<p>The below code goes within the onclick of the submit button using jquery..</p>

<pre><code>if(conditionsNotmet)
{
return false;
}
</code></pre>


blocks|key|871971|text|使用JQuery更加简单:可以在Asp.Net、MVC和Asp.Core中工作|type|unstyled|depth|inlineStyleRanges|entityRanges|data|871972|​|871973|<script>
++++$('#btnSubmit').on('click',+function+()+{

++++++++if+(ValidData)+{
++++++++++++return+true;+++//submit+the+form
++++++++}
++++++++else+{
++++++++++++return+false;++//cancel+the+submit
++++++++}
++++});
</script>|code-block|syntax|javascript|871974|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>With JQuery is even more simple: works in Asp.Net MVC and Asp.Core</p>

<p></p>

<pre><code>&lt;script&gt;
    $('#btnSubmit').on('click', function () {

        if (ValidData) {
            return true;   //submit the form
        }
        else {
            return false;  //cancel the submit
        }
    });
&lt;/script&gt;
</code></pre>


blocks|key|1086230|text|使用onclick='return+btnClick();'|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1086231|和|1086232|function+btnClick()+{
++++return+validData();
}|code-block|syntax|javascript|1086233|entityMap^0|2|S|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|R|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|S|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|T|8|@]|D|@]|E|$]]]|N|$]]

<p>use <code>onclick='return btnClick();'</code></p>

<p>and</p>

<pre><code>function btnClick() {
    return validData();
}
</code></pre>


blocks|key|871493|text|function+btnClick()+{
++++return+validData();
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|871494|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>function btnClick() {
    return validData();
}
</code></pre>


blocks|key|871932|text|<input+type='button'+onclick='buttonClick()'+/>

<script>
function+buttonClick(){
++++//Validate+Here
++++document.getElementsByTagName('form')[0].submit();
}
</script>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|871933|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>&lt;input type='button' onclick='buttonClick()' /&gt;

&lt;script&gt;
function buttonClick(){
    //Validate Here
    document.getElementsByTagName('form')[0].submit();
}
&lt;/script&gt;
</code></pre>


<p>I'm working on an ASP.net web application.</p>

<p>I have a form with a submit button.  The code for the submit button looks like <code>&lt;input type='submit' value='submit request' onclick='btnClick();'&gt;</code>.</p>

<p>I want to write something like the following:</p>

<pre><code>function btnClick() {
    if (!validData())
        cancelFormSubmission();
}
</code></pre>

<p>How do I do this?</p>


How do I cancel form submission in submit button onclick event?

我正在开发一个ASP.net web应用程序。我有一个带有提交按钮的表单。submit按钮的代码看起来像<input type='submit' value='submit request' onclick='btnClick();'>。我想写一些类似下面这样的代码：function btnClick() {    if (!validData())        cancelFormSubmis

问如何在submit button onclick事件中取消表单提交？
EN

回答 12

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在submit button onclick事件中取消表单提交？EN

回答 12

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在submit button onclick事件中取消表单提交？
EN