由于项目在优化的时候需要用到弹出框,按自己的想法是傻傻的用一些alert直接弹出得了,但是这样用户体验度不是特别好,影响界面美观,所以自己还是用了封装好的easyui给的消息框,怎么用呢,这个里面很有文章。

我用的是那种弹出框有确定、取消功能的消息提示框,所以重点说一下这个的用法。

需求:需要对一个事件进行判断是否往下进行?

做法:

  • 引用easyui封装部分:
    <script src="../../Scripts/jquery-1.7.1.min.js"></script>
<script src="../../Scripts/jquery-1.7.1.js"></script>
<script src="../../EasyuiSource/jquery.easyui.min.js"></script>
<link href="../../Content/base-master/src/base.css" rel="stylesheet" />
<link href="../../Content/iconfont-master/index.css" rel="stylesheet" />
<link href="../../Content/jquery-easyui-1.3.2/themes/icon.css" rel="stylesheet" />
<link href="../../Content/jquery-easyui-1.3.2/themes/default/easyui.css" rel="stylesheet" />
  • Html部分:
<a href="#" class="easyui-linkbutton" id="up1" data-options="iconCls:'icon-redo'" type="text/html" onclick="Next()" style="margin-left: 750px;">完成</a>
  • JavaScript部分:
    function Next() {
$.messager.confirm('温馨提示', '完成后信息无法修改,确定完成吗?', function (r) {
if (r)//选择确定或者OK
{
$.ajax({
type: "POST",
url: "/FreshNewReport/UpdateBasicStudentinfo",
success: function (data) {
if (data == "True") {
window.location.href = "../FreshNewReport/SuccessReport";
}
else {
$.messager.alert('警告','信息入库失败,请联系管理员','info')
}
}
});
}
})
}
  • 效果:

  • 上面的点击按钮为英文的,如果想变为中文的,修改JavaScript部分即可,如下:
    function Next() {
$.extend($.messager.defaults, {
ok: "确定",
cancel: "取消"
});
$.messager.confirm('温馨提示', '完成后信息无法修改,确定完成吗?', function (r) {
if (r)//选择确定或者OK
{
$.ajax({
type: "POST",
url: "/FreshNewReport/UpdateBasicStudentinfo",
success: function (data) {
if (data == "True") {
window.location.href = "../FreshNewReport/SuccessReport";
}
else {
$.messager.alert('警告','信息入库失败,请联系管理员','info')
}
}
});
}
})
}

想要了解更多的关于提示框的点击:快来瞧瞧

感谢您的宝贵时间···

Easyui-交互式消息弹出框的更多相关文章

  1. 移动web:Tips消息弹出框

    在web开发中经常会用到像alert这样的弹出消息,每个浏览器自带的消息弹出框都不相同.为了统一外观,实现自定义的功能,动手写一个弹出框插件. 对弹出框的实现要求如下: 1. 仿照IOS系统弹出外观 ...

  2. MessageBox页面消息弹出框类

    MessageBox页面消息弹出框类: public class MessageBox { /// <summary> /// 自定义弹出窗口内容,不跳转 /// </summary ...

  3. WPF实战之一 桌面消息框(右下角消息弹出框)

    此版本是根据别人的项目改造的,记录下笔记 原文:https://blog.csdn.net/catshitone/article/details/75089069 一.即时弹出 1.创建弹出框 新建一 ...

  4. Js:消息弹出框、获取时间区间、时间格式、easyui datebox 自定义校验、表单数据转化json、控制两个日期不能只填一个

    (function ($) { $.messageBox = function (message) { $.messager.show({ title:'消息框提示', msg:message, sh ...

  5. windows phone 8.1开发:(消息弹出框)强大的ContentDialog

    原文出自:http://www.bcmeng.com/contentdialog/ 在应用开发中我们必不可少的会使用到消息框,windows phone8中的messagebox在windows ph ...

  6. Android----消息弹出框

    关于Android的知识,自从工作了就没有什么时间去总结学习过的知识,我个人比较喜欢学习后总结,今天就写一下关于android中消息弹出框的几种方式的简单示例,按照自己的思路写了一段,希望对和我一样在 ...

  7. Windows Phone 几种弹出框提示方式

    首先,我们需要在网络上下载一个Coding4Fun 然后,引用  using Coding4Fun.Phone.Controls.Toolkit;                using Codin ...

  8. js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .

    js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...

  9. 玩转EasyUi弹出框

    这两天在搞EasyUi的弹出框,弹出框之前也搞过很多个版本,总是觉得不那么完美,刚好最近有时间,就往多处想了想,功能基本上达到我的预期,并且在开发过程中遇到很多小技巧,特撰文如下. 走起:在EasyU ...

随机推荐

  1. HDU4825(字典树+贪心)

    Xor Sum Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 132768/132768 K (Java/Others)Total S ...

  2. 杂项:DCloud.io

    ylbtech-杂项:DCloud.io 1.返回顶部 1. DCloud.io,数字天堂(北京)网络技术有限公司. 国内HTML5产业的领军企业,W3C会员,HTML5中国产业联盟发起单位Dclou ...

  3. 关于python+django操作数据库中的表

    数据库中的表示这样设计的 class C(models.Model): name = models.CharField(max_length=32) class B(models.Model): na ...

  4. 2016全国大学生信息安全竞赛(Misc)

    你好,i春秋: 关注i春秋公众微信号,然后发送CTF,机器人会问星期几,按实回答,然后发送你好,机器人会回复你好,然后随便发几句,机器人会问是否愿意陪他聊天,回复不愿意,机器人就会发flag kill ...

  5. python的raw_input()函数。 函数的可变对象和不可变对象作为参数传递。

    python的raw_input()函数, 接受键盘输入, 其返回值是字符串类型, 所以当输入的是数字时, 如果是想参与算术运算, 必须要对其进行类型转换. python的参数传递, 对于可变对象和不 ...

  6. 2015.3.2 VC++6制作非MFC dll以及VS2005、VS2010调用

    1.在VC6中新建工程,选择Win32 Dynamic-Link Libary,输入dll名称如 DLL2015 2.在类型选择中,选择第2项 A Simple Dll project OK 3.随后 ...

  7. spring MVC 异常处理整理

    一.异常结构 1.异常由外到内如下: web服务器处理异常--->web应用里面web.xml处理异常--->Spring框架处理异常---->控制器注释处理异常--->控制器 ...

  8. leetcode479

    public class Solution { public int LargestPalindrome(int n) { ) ; , n) - ; ; v > max / ; v--) { S ...

  9. DAY7-面向对象之绑定方法与非绑定方法

    一.类中定义的函数分成两大类 一:绑定方法(绑定给谁,谁来调用就自动将它本身当作第一个参数传入): 1. 绑定到类的方法:用classmethod装饰器装饰的方法. 为类量身定制 类.boud_met ...

  10. linux驱动开发的经典书籍

    转载于:http://www.cnblogs.com/xmphoenix/archive/2012/03/27/2420044.html 参加实习也近一个月了,严重感觉知识不够,真是后悔学校里浪费那么 ...