Home > Web Front-end > JS Tutorial > JS implementation method to obtain the values ​​​​of multiple input boxes with the same name

JS implementation method to obtain the values ​​​​of multiple input boxes with the same name

高洛峰
Release: 2017-01-10 09:39:07
Original
1721 people have browsed it

Let’s first look at the implementation of the input password input box based on JS code to change the password to black dots and cipher text. The specific code is as follows:

html code

<form id="login-form" method="post" onsubmit="return checkForm()">
 输入密码<input type="password" id="input-password">
 <input type="hidden" id="md5-password" name="password">
 <button type="submit">Submit</button>
</form>
Copy after login

js code

function checkForm() {
 var input_pwd = document.getElementById(&#39;input-password&#39;);
 var md5_pwd = document.getElementById(&#39;md5-password&#39;);
 // 把用户输入的明文变为MD5:
 md5_pwd.value = toMD5(input_pwd.value);
 // 继续下一步:
 return true;
}
Copy after login

Supplement: JS obtains multiple names with the same name The value of the input box

Initially, document.all.id.length was used to obtain the number of input boxes, but sometimes it was normal and sometimes it showed undefined. The effect was not very good. Online information said that document.all was not compatible. Of all browsers, it seems to only support IE now.

The solution is as follows:

var els =document.getElementsByName("search");
for (var i = 0, j = els.length; i < j; i++){
alert(els[i].value);
}
Copy after login

The above is the JS code introduced by the editor to implement the input password input box to change the password to black dots and ciphertext. I hope It will be helpful to everyone. If you have any questions, please leave me a message and the editor will reply to you in time. I would also like to thank you all for your support of the PHP Chinese website!

For more JS implementation methods to obtain the values ​​​​of multiple input boxes with the same name, please pay attention to the PHP Chinese website for related articles!

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