Jquery或者JS方法验证密码是否一致

1

		<p>2</p>

		<p>3</p>

		<p>4</p>

		<p>5</p>

		<p>6</p>

		<p>7</p>

		<p>8</p>

		<p>9</p>

		<p>10</p>

		<p>11</p>

		<p>12</p>

		<p>13</p>

		<p>14</p>

		<p>15</p>

		<p>16</p>

		<p>17</p>

		<p>18</p>

		<p>19</p>
		</td>
		<td>
		<p><code>&lt;script src=</code><code>"../JS/jquery-3.2.0.js"</code>&nbsp;<code>type=</code><code>"text/javascript"</code>&nbsp;<code>&gt;&lt;/script&gt;</code></p>

		<p><code>&lt;script src=</code><code>"../JS/bootstrap.min.js"</code><code>&gt;&lt;/script&gt;</code></p>

		<p><code>&lt;link type=</code><code>"text/css"</code>&nbsp;<code>rel=</code><code>"stylesheet"</code>&nbsp;<code>href=</code><code>"../css/bootstrap.min.css"</code>&nbsp;<code>/&gt;</code></p>

		<p>&nbsp;</p>

		<p><code>&lt;body&gt;</code></p>

		<p><code>&lt;div&nbsp;</code><code>class</code><code>=</code><code>"form-group"</code><code>&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;label&nbsp;</code><code>class</code><code>=</code><code>"col-sm-2 control-label font"</code><code>&gt;密码&lt;/label&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;div&nbsp;</code><code>class</code><code>=</code><code>"col-xs-10"</code><code>&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;input type=</code><code>"password"</code>&nbsp;<code>class</code><code>=</code><code>"form-control bt"</code>&nbsp;<code>name=</code><code>"pwd"</code>&nbsp;<code>id=</code><code>"pwd"</code>&nbsp;<code>placeholder=</code><code>"请设置登录密码"</code><code>&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/div&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/div&gt;&lt;br/&gt;&lt;br/&gt;&lt;br/&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code>&nbsp;</p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;div&nbsp;</code><code>class</code><code>=</code><code>"form-group"</code><code>&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;label&nbsp;</code><code>class</code><code>=</code><code>"col-sm-2 control-label font"</code><code>&gt;确认密码&lt;/label&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;div&nbsp;</code><code>class</code><code>=</code><code>"col-xs-10"</code><code>&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;input type=</code><code>"password"</code>&nbsp;<code>class</code><code>=</code><code>"form-control bt"</code>&nbsp;<code>name=</code><code>"pwd"</code>&nbsp;<code>id=</code><code>"pwd1"</code>&nbsp;<code>placeholder=</code><code>"请再次填写密码"</code>&nbsp;<code>onkeyup=</code><code>"validate()"</code><code>&gt;&lt;span id=</code><code>"tishi"</code><code>&gt;&lt;/span&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/div&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>&lt;/div&gt;&lt;br/&gt;&lt;br/&gt;</code></p>

		<p><code>&lt;/body&gt;</code></p>
		</td>
	</tr></tbody></table><p>&nbsp;JS方式&nbsp;onkeyup="validate()"是引用方法的方式</p>

1

		<p>2</p>

		<p>3</p>

		<p>4</p>

		<p>5</p>

		<p>6</p>

		<p>7</p>

		<p>8</p>

		<p>9</p>

		<p>10</p>

		<p>11</p>

		<p>12</p>

		<p>13</p>

		<p>14</p>

		<p>15</p>

		<p>16</p>

		<p>17</p>
		</td>
		<td>
		<p><code>&lt;script&gt;</code></p>

		<p><code>function</code>&nbsp;<code>validate() {</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>var</code>&nbsp;<code>pwd1 = document.getElementById(</code><code>"pwd"</code><code>).value;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>var</code>&nbsp;<code>pwd2 = document.getElementById(</code><code>"pwd1"</code><code>).value;</code></p>

		<p>&nbsp;</p>

		<p><code>&lt;!-- 对比两次输入的密码 --&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>if</code><code>(pwd1 ==&nbsp;pwd2)</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>{</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>document.getElementById(</code><code>"tishi"</code><code>).innerHTML=</code><code>"&lt;font color='green'&gt;两次密码相同&lt;/font&gt;"</code><code>;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>document.getElementById(</code><code>"button"</code><code>).disabled = false;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>}</code></p>

		<p><code>else</code>&nbsp;<code>{</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>document.getElementById(</code><code>"tishi"</code><code>).innerHTML=</code><code>"&lt;font color='red'&gt;两次密码不相同&lt;/font&gt;"</code><code>;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>document.getElementById(</code><code>"button"</code><code>).disabled = true;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>}</code></p>

		<p><code>}</code></p>

		<p><code>&lt;/script&gt;</code></p>
		</td>
	</tr></tbody></table><p>&nbsp;Jquery方法</p>

1

		<p>2</p>

		<p>3</p>

		<p>4</p>

		<p>5</p>

		<p>6</p>

		<p>7</p>

		<p>8</p>

		<p>9</p>

		<p>10</p>

		<p>11</p>

		<p>12</p>

		<p>13</p>

		<p>14</p>

		<p>15</p>

		<p>16</p>

		<p>17</p>

		<p>18</p>

		<p>19</p>
		</td>
		<td>
		<p><code>&lt;script&gt;</code></p>

		<p><code>function</code>&nbsp;<code>validate() {</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code>&nbsp;</p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>var</code>&nbsp;<code>pwd = $(</code><code>"#pwd"</code><code>).val();</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>var</code>&nbsp;<code>pwd1 = $(</code><code>"#pwd1"</code><code>).val();</code></p>

		<p><code>&lt;!-- 对比两次输入的密码 --&gt;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>if</code><code>(pwd == pwd1)</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>{</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>$(</code><code>"#tishi"</code><code>).html(</code><code>"两次密码相同"</code><code>);</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>$(</code><code>"#tishi"</code><code>).css(</code><code>"color"</code><code>,</code><code>"green"</code><code>);</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>$(</code><code>"#xiugai"</code><code>).removeAttr(</code><code>"disabled"</code><code>);</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>}</code></p>

		<p><code>else</code>&nbsp;<code>{</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>$(</code><code>"#tishi"</code><code>).html(</code><code>"两次密码不相同"</code><code>);</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>$(</code><code>"#tishi"</code><code>).css(</code><code>"color"</code><code>,</code><code>"red"</code><code>)</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>$(</code><code>"button"</code><code>).attr(</code><code>"disabled"</code><code>,</code><code>"disabled"</code><code>);&nbsp;&nbsp;</code></p>

		<p><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>}</code></p>

		<p><code>}</code></p>

		<p><code>&lt;/script&gt;</code></p>
		</td>
	</tr></tbody></table>            </div>
            </div>

猜你喜欢

转载自blog.csdn.net/qq_43001609/article/details/83018550