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

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>

jquery 弹出登陆框，简单易懂！修改密码效果代码的更多相关文章

  1. 基于jQuery鼠标点击弹出登陆框效果

    基于jQuery鼠标点击弹出登陆框效果.这是一款扁平样式风格的jQuery弹出层登陆框特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <input type=" ...

  2. Jquery 弹出提示框输入插件 apprise 修改中文按钮以及使用说明

      apprise的使用非常简单,引入js脚本和css <script type="text/javascript" src="/js/apprise-1.5.fu ...

  3. 从头开始一步一步实现EF6+Autofac+MVC5+Bootstarp极简前后台ajax表格展示及分页（二）前端修改、添加表格行点击弹出模态框

    在前一篇中,由于不懂jquery,前端做的太差了,今天做稍做修改,增加一个跳转到指定页面功能,表格行点击样式变化.并且在表格中加入bootstarp的按钮组,按钮点击后弹出模态框,须修改common, ...

  4. javascript--自定义弹出登陆窗口（弹出窗）

    web开发中浏览器对象封装了诸如prompt.alert.confirm等弹出框,但是有的弹出框并不能满足开发需要,需要我们自己定义弹出框,诸如用户登陆框.消息提示框等.本文利用弹出用户登陆框示例,对 ...

  5. 基于Jquery 简单实用的弹出提示框

    基于Jquery 简单实用的弹出提示框 引言: 原生的 alert 样子看起来很粗暴,网上也有一大堆相关的插件,但是基本上都是大而全,仅仅几句话可以实现的东西,可能要引入好几十k的文件,所以话了点时间 ...

  6. js+jquery手写弹出提示框

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  7. datatables.js 简单使用--弹出编辑框或添加数据框

    内容:选中某一条记录,弹出编辑框 环境:asp.net mvc ,  bootstrap 显示效果: 代码: 至于怎么弄多选框,在上一篇博客里已经有说明. 主要用到了bootstrap的模态窗,下面代 ...

  8. 【如何使用jQuery】【jQuery弹出框】【jQuery对div进行操作】【jQuery对class，id，type的操作】【jquery选择器】

    1.如何使用jQuery jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗旨 ...

  9. jquery删除记录弹出提示框

    来自于<jquery权威指南> ------------------- 点击删除时,弹出提示框,并做相应的删除确定或取消 完整代码如下: <!DOCTYPE html PUBLIC ...

随机推荐

  1. Struts2图片文件上传，判断图片格式和图片大小

    1. 配置Struts2能够上传的最大文件大小 使用Struts2进行文件上传的时候,Struts2默认文件大小最大为2MB,如果要传大一点的文件,就需要修改struts.xml配置文件,重新设置能够 ...

  2. php中include文件变量作用域的研究

    原文:php中include文件变量作用域的研究 在php中我们有时候需要include一个文件.比如我前段时间在写一个框架的时候,打算用原生的php作为模板,然后写一个display方法引入模板文件 ...

  3. 测试关闭mojo utf-8

    [root@wx03 ~]# cat test.pl use Mojolicious::Lite; use JSON qw/encode_json decode_json/; use Encode; ...

  4. 怎样从ext3升级到ext4？

    Ext4 文件系统提供了更佳的性能和可靠性,具有了更为丰富的功能,那么,怎样从ext3升级到ext4呢? 首先,我们须要保证系统支持ext4,一般来说,内核版本号在2.6.28及以上的版本号才支持ex ...

  5. XMPP入门

    本人原创,很多其它xmpp知识.ios知识.其它分享知识见:我的个人博客 简单介绍: 1.XMPP是可扩展消息与存在协议,主要用于im. 2.他是一种类似于http协议的传输数据协议.过程如:&quo ...

  6. 虚继承之单继承的内存布局（VC在编译时会把vfptr放到类的头部，这和Delphi完全一致）

    C++2.0以后全面支持虚函数与虚继承,这两个特性的引入为C++增强了不少功能,也引入了不少烦恼.虚函数与虚继承有哪些特性,今天就不记录了,如果能搞了解一下编译器是如何实现虚函数和虚继承,它们在类的内 ...

  7. IOT和HEAP表区别

    Index Organized table by itself is a B-tree index. Index key is the primary key and the rest of colu ...

  8. 2cifang.com_2次方学习

    2cifang.com_2次方学习

  9. 模仿《百度音乐HD》添加到下载框动画

    上次听有人说喜欢<百度音乐HD>添加到下载动画 ,我就尝试模仿了下,没想到,今天code4app(地址)也有了这个,但是 这个动画基本相同,我们的思路还是部一样的. 都可以参考 .主要关键 ...

  10. ubuntu12.04安装搜狗输入法配置，安装packettracer字体设置，软件推荐

    装上系统,后的各种配置,各种出错之后的解决. 一.安装搜狗输入法 如果系统以前安装了先卸载: sudo apt-get remove fcitx* #删除配置文件 sudo apt-get purge ...