Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
152 views
in Technique[技术] by (71.8m points)

javascript - 从html表单调用Javascript(Calling Javascript from a html form)

I am basing my question and example on Jason's answer in this question(我将我的问题和示例基于Jason在问题中的回答)

I am trying to avoid using an eventListener , and just to call handleClick onsubmit , when the submit button is clicked.(我试图避免使用eventListener ,而是在单击提交按钮时仅调用handleClick onsubmit 。) Absolutely nothing happens with the code I have.(我拥有的代码绝对不会发生任何事情。) Why is handleClick not being called?(为什么不调用handleClick ?) <html> <head> <script type="text/javascript"> function getRadioButtonValue(rbutton) { for (var i = 0; i < rbutton.length; ++i) { if (rbutton[i].checked) return rbutton[i].value; } return null; } function handleClick(event) { alert("Favorite weird creature: "+getRadioButtonValue(this["whichThing"])); event.preventDefault(); // disable normal form submit behavior return false; // prevent further bubbling of event } </script> </head> <body> <form name="myform" onSubmit="JavaScript:handleClick()"> <input name="Submit" type="submit" value="Update" onClick="JavaScript:handleClick()"/> Which of the following do you like best? <p><input type="radio" name="whichThing" value="slithy toves" />Slithy toves</p> <p><input type="radio" name="whichThing" value="borogoves" />Borogoves</p> <p><input type="radio" name="whichThing" value="mome raths" />Mome raths</p> </form> </body> </html> edit:(编辑:) Please do not suggest a framework as a solution.(请不要提出框架作为解决方案。) Here are the relevant changes I have made to the code, which results in the same behavior.(这是我对代码进行的相关更改,导致相同的行为。) function handleClick() { alert("Favorite weird creature: "+getRadioButtonValue(document.myform['whichThing']))); event.preventDefault(); // disable normal form submit behavior return false; // prevent further bubbling of event } </script> </head> <body> <form name="aye">; <input name="Submit" type="submit" value="Update" action="JavaScript:handleClick()"/> Which of the following do you like best? <p><input type="radio" name="whichThing" value="slithy toves" />Slithy toves</p> <p><input type="radio" name="whichThing" value="borogoves" />Borogoves</p> <p><input type="radio" name="whichThing" value="mome raths" />Mome raths</p> </form>   ask by Joshxtothe4 translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You can either use javascript url form with(您可以将javascript网址形式与)

<form action="javascript:handleClick()"> Or use onSubmit event handler(或使用onSubmit事件处理程序) <form onSubmit="return handleClick()"> In the later form, if you return false from the handleClick it will prevent the normal submision procedure.(在后面的形式中,如果从handleClick返回false,则将阻止正常的细分过程。) Return true if you want the browser to follow normal submision procedure.(如果希望浏览器遵循常规的细分过程,则返回true。) Your onSubmit event handler in the button also fails because of the Javascript: part(您的按钮中的onSubmit事件处理程序也由于Javascript:部分而失败) EDIT: I just tried this code and it works:(编辑:我只是尝试此代码,它的工作原理:) <html> <head> <script type="text/javascript"> function handleIt() { alert("hello"); } </script> </head> <body> <form name="myform" action="javascript:handleIt()"> <input name="Submit" type="submit" value="Update"/> </form> </body> </html>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...