javascript 添加事件提交按钮

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14555115/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 21:58:07  来源:igfitidea点击:

Add event to submit button

javascripthtmlcss

提问by user2016861

i have just started studying js with this js code

我刚刚开始用这个 js 代码学习 js

<div class="container">    
    <form name="myForm" action="#"  method="post">
        First name: <input type="text" name="fname">
        <input type="submit" value="Submit" id="smit">
    </form> 

  <script>
var smit=document.getElementById("smit");
smit.addEventListener("click",formvalidate(),false); 

function formvalidate(){

    console.log(" vua moi click submit");

    if(t==null){
        var t= document.forms["myForm"]["fname"].value;
        if(t==null || t==""){
             alert("xin dien vao email");

        }
    }

}
</script>

When previewing in browser, a alert popup auto appear despite i not click on submit button. Can anyone please explain me what happening? Thanks.

在浏览器中预览时,尽管我没有点击提交按钮,但会自动出现警告弹出窗口。谁能解释一下发生了什么?谢谢。

回答by Joseph Silber

The parentheses after your function name causes the function to be calledright away. Since you're just assigning it as the event listener, you want to passit.

函数名后面的括号会立即调用该函数。由于您只是将其分配为事件侦听器,因此您希望传递它。

Remove the parentheses and it'll wait for the click before executing:

删除括号,它会在执行前等待点击:

smit.addEventListener("click", formvalidate, false);
//                                        ^^ No parentheses

回答by HMR

I have made some little changes so it'll work in IE as well:

我做了一些小改动,所以它也可以在 IE 中工作:

<form name="myForm" id="myForm" action="#"  method="post">
    First name: <input type="text" name="fname" id="fname">
    <input type="submit" value="Submit" id="smit">
</form>

<script >
function formvalidate(event){
//removed console log because that only works in ie
// when debugging
    var t= document.getElementById("fname").value;
    if(t==""){
       alert("xin dien vao email");
       if(event.preventDefault){ event.preventDefault()}; 
       if(window.event){window.event.returnValue = false;}
    }
}
var smit=document.getElementById("myForm");
if(smit.addEventListener){
    smit.addEventListener("submit",formvalidate,false);
}else{
    //ie doesn't have addEventListner
    smit.attachEvent('onsubmit', formvalidate);
}
</script>

回答by Sudhir Bastakoti

remove parenthesis from formvalidate, like:

从 formvalidate 中删除括号,例如:

smit.addEventListener("click",formvalidate(),false); 

to

smit.addEventListener("click",formvalidate,false); 

See: addEventListener

请参阅:addEventListener

回答by Ravindra Bagale

Event listener does not contains parenthesis, removes it .if you add parenthesis to it , it looks like function but here you have to assign your eventlistener.

事件侦听器不包含括号,将其删除。如果向其添加括号,它看起来像函数,但在这里您必须分配事件侦听器。

smit.addEventListener("click",formvalidate,false);