新建一个div:

<div class="container" id="loginForm" hidden>
<h4 class="form-signin-heading">用户登录</h4>
<hr />
<div class="form-group">
<input type="text" class="form-control" id="KeyName" placeholder="Auth Key" name="Key">
</div>
<div class="form-group">
<input type="password" class="form-control" id="Pwd" placeholder="Auth Secret" name="Secret">
</div>
<div class="form-group">
<button class="btn btn-large btn-primary" id="btnLogin" onclick="LoginCheck()">登录</button>
</div>
</div>

弹框js写法,可以存放在初始化中:

function showDialogLogin() {
$("#loginForm").dialog({
height: ,
width: ,
// 模态开启
modal: true,
// 是否可拖拽
draggable: true,
// 最小宽度
minWidth: ,
//当用户按 Esc 键之后,是否应该关闭对话框,默认为 true
closeOnEscape: true });
}

获取值登录:

function LoginCheck() {
var key = $("#KeyName").val();
var Secret = $("#Pwd").val();
var data = { key, Secret }
$.ajax({
type: "post",
dataType: "json",
url: '/account/Login',
data: data,
success: function (res) {
if (res.Message == "success") {
$("#loginForm").dialog('close');
}
else {
alert("请重新输入");
}
},
error: function () {
alert("请重新输入");
},
});
};

jquery-ui弹框登录前端写法的更多相关文章

  1. 解决 jquery dialog 弹框destroy销毁方法不能把弹出元素设置成初始状态

    在使用jquery ui中的dialog弹出窗口的时候遇到一个问题,就是页面弹出窗口关闭后希望表单元素能回到初始状态 例如文本框输入内容后关闭dialog后里面的内容清除,使用了destroy方法也不 ...

  2. easy ui 弹框叠加问题

    1.框架用的是.net MVC,Index页面如下所示: @{ Layout = "~/Views/Shared/_CustomerLayout.cshtml"; ViewBag. ...

  3. jquery UI 弹出框

    2015-07-17 11:04:38 <div id="reg"></div> <script type="text/javascript ...

  4. jquery Dialog弹框插件

    function Dialog(options) { var defaults = { // 默认值. title: '', // 标题文本,若不想显示title请通过CSS设置其display为no ...

  5. jQuery UI弹出新窗体

    借助jqueryUI 的Dialog 在隐藏的div中嵌入Iframe  改变iframe的路径 如果项目经常用到弹出新窗体,则利用模板,把此代码和html 放入父页面中,实现父级调用, <in ...

  6. jquery Dialog弹框插件使用

    var dialog = new Dialog({ title: '购物车', type: 'url', width: 520, content: "Uplolo.aspx", s ...

  7. jquery widgets 弹框

    <div id='dialog' style="display:none;"> <div style="text-align:center;" ...

  8. jquery ui dialog弹出窗 清空缓存Cache或强制刷新

    我用jquery ui 弹出一个购物车的对话,通过AJAX加载的数据.发现购物车被缓存,一直看到是旧数据.为了刷新购物车更新,我必须去加一个刷新按钮,点击后更新购物车页面.有没有一种方法来自动刷新加载 ...

  9. 解决Select2控件不能在jQuery UI Dialog中不能搜索的bug

    本文使用博客园Markdown编辑器进行编辑 1.问题呈现 项目中使用了jQuery UI的Dialog控件,一般用来处理需要提示用户输入或操作的简单页面.逻辑是修改一个广告的图片和标题. 效果截图如 ...

随机推荐

  1. react-native布局篇

    原文链接:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/react-native%E5%B8%83%E5%B1%80/ 一.宽度和 ...

  2. JProfiler远程监控

    1.  服务端安装JProfiler(与客户端版本一致) 2.  客户端配置连接: A).session——integration wizards——New remote integration B) ...

  3. 使用uploadify上传图片时返回“Cannot read property 'queueData' of undefined”

    在使用uploadify插件上传图片时,遇到一个比较坑的错误:上传时提示“Cannot read property 'queueData' of undefined”. 遇到这个问题有点无语,因为这个 ...

  4. sqlplus 执行 sql 文件

    SQL>START file_name or SQL>@ file_name 1 .sqlplus system/system@srv  2. sql>@c:\a.sql  (执行此 ...

  5. java实现八种排序算法并测试速度

    速度测试: (1) 随机数范围:0-100希尔排序: => Time is 38600基数排序: => Time is 53300快速排序: => Time is 46500堆  排 ...

  6. MongoDB学习笔记(一)安装配置

    文档存储:文档存储一般用类似json的格式存储,存储的内容是文档型的. MongoDB 将数据存储为一个文档,数据结构由键值(key=>value)对组成.MongoDB 文档类似于 JSON ...

  7. flex学习, 尝试布局一个计算器

    <!DOCTYPE html> <html> <head> <title>flex</title> </head> <st ...

  8. LeetCode 90:Subsets II

    Given a collection of integers that might contain duplicates, nums, return all possible subsets. Not ...

  9. 【PMP】项目采购管理~重点知识

    1.合同的类型与区别 固定总价(FFP):大多数买方都喜欢这种合同,因为货物的采购价格在一开始就已确定,并且不允许改变(除非工作范围发生变更) 总价加激励费用(FPIF):这种总价合同给买方和卖方提供 ...

  10. Mac下用zsh

    最近好多实验要跑,有时候Finder切换来切换去,感觉还不如用terminal. Mac默认的shell是bash.所以说我其实今天才弄明白shell和terminal之间的关系.在人和计算机内核之间 ...