Home > Web Front-end > JS Tutorial > body text

How to solve the form reset reset is not a function error

一个新手
Release: 2017-10-14 09:42:57
Original
2913 people have browsed it

Actually, I encountered this bug a long time ago. As a result, I encountered this bug again in recent development, and it also cost me some time. For example, after I submitted the form using Ajax, I needed to reset the various contents of the form from the interaction point of view. To avoid repeated submissions by users, the normal form HTML structure is as follows:

<form action="" method="post" id="LoginForm">
  <input type="text" name="username" value="" />
  <input type="password" name="password" value="" />
  <input type="submit" id="submit" name="submit" value="Login" />
  <input type="reset" id="reset" name="reset" value="Reset" />
</form>
Copy after login

If you simply need to use JavaScript to reset, you can use document.getElementById('LoginForm').reset() To achieve this, use jQuery to use $('#LoginForm')[0].reset() or $('#LoginForm').trigger("reset"), but For the above forms designed in HTML, these reset form methods are invalid! FireBug debugging prompt...reset is not a function, where is the problem here? Sometimes you never think that a small bad habit will cause considerable trouble. After struggling for a long time, I searched the Internet and found the answer on stackoverflow. It turns out that the problem lies with the reset button. Let’s focus on the HTML implemented by the reset button:

<input type="reset" id="reset" name="reset" value="Reset" />
Copy after login

The problem lies in id="reset" and name="reset", the reset attribute here covers the original reset method. Naturally, it cannot be called and prompts is not a function. The solution is also very simple. Avoid Use the reset keyword to name the name and id attributes of the reset button. For example, the following naming method is safer:

<input type="reset" id="ResetButton" name="ResetButton" value="Reset" />
Copy after login

Okay, a small problem caused by naming has been solved. At this time, I noticed the submit button, whose id="submit"And name="submit", will it cause the submit() method of the form form to fail? Since I used Ajax to submit, I didn’t delve into this issue. Maybe I changed id="submit" and name="submit" to different names, such as id="SubmitButton" and name="SubmitButton" would be better.

The above is the detailed content of How to solve the form reset reset is not a function error. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!