jquery 弹出登陆框，简单易懂！修改密码效果代码

最新推荐文章于 2024-04-28 11:28:01 发布

java的爪哇

最新推荐文章于 2024-04-28 11:28:01 发布

阅读量7.4k

点赞数 3

分类专栏： jquery 文章标签： ui js jquery ui jquery

本文链接：https://blog.csdn.net/liangrui1988/article/details/10833493

版权

jquery 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

在网上找了一大堆，看的眼花瞭乱，还是研究原码，自已搞出来了！

ui原地址:http://jqueryui.com/dialog/#modal-form

可以把js,css下载到本地，要不然不联网的话，什么都没了!

效果：

代码如下，我是把需要的都下载到了本地，

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Dialog - Modal form</title>  
  <link rel="stylesheet" href="jquery-ui.css" />
  <script src="jquery-1.9.1.js"></script>
  <script src="jquery-ui.js"></script> 
  
<script>
$(function(){

	$( "#testDialog" ).dialog({
      autoOpen: false,
      height: 380,
      width: 350,
      modal: true,
      buttons: {
        "确定": function() {
			var pass1V= $("#pass1").val();
			var pass2V=$("#pass2").val();
		 if(checkRegexp(pass1V,pass2V)){
		 if(pass1V!=pass2V){ alert("两次密码输入不一致!");return false;}
		 alert("updateOK");
         $( this ).dialog( "close" );
		 }else{
		 alert("请正确输入密码[a-zA-Z0-9] 6-12位");		 
		 }
         },

		"取消": function() {
         $( this ).dialog( "close" );
          }
        }
      });//dialog end;

//验证密码为a-zA-Z0-9 6-12位
function checkRegexp(passVal1,passVal2){
	if(passVal1.length<6||passVal1.length>12){return false;}
	var regexp=/^([0-9a-zA-Z])+$/;	
	if(!(regexp.test(passVal1))){return false;}
	return true;
}

$("#dialogHOpen").click(function(){
$("#testDialog").dialog("open");
});//open end;


  
});//jquery end;
  </script>

 <style type="text/css">
#testDialog{display:none; height: 600, width: 650,}
 </style>
</head>


<body>
 <button id="dialogHOpen">dialogHOpen</button>
<div id="testDialog">
请输入新密码:<input type="password" id="pass1"/><br/>
再次输入密码:<input type="password" id="pass2"><br/>
</div>

日期控件:

java的爪哇

关注

3
点赞
踩
9

收藏

觉得还不错? 一键收藏
0
评论
jquery 弹出登陆框，简单易懂！修改密码效果代码

jquery 弹出登陆框，简单易懂！修改密码效果代码在网上找了一大堆，看的眼花瞭乱，还是研究原码，自已搞出来了！ui原地址:http://jqueryui.com/dialog/#modal-form可以把js,css下载到本地，要不然不联网的话，什么都没了!效果：
复制链接

扫一扫