1. 首页 > 电脑教程 > 利用jqueryUI做出来的提示框,方便后台弹出框提示使用。

利用jqueryUI做出来的提示框,方便后台弹出框提示使用。

全年在一个项目中,在弹出窗体上用了alert,效果不是很好。alert是浏览器级别的,一但弹出来,那整个浏览器都被封住,只有你点击了之后才能点击其他页面。有时候用了多标签的框架,感觉很是不方便。所以,萌生用模拟的DIV来代替alert。以下是我做的部分代码,模拟弹出窗体我搜索了很多,最后还是用了JQUERY UI,功能真的很强大。

  这个类每个WEB页面都要继承的,我把JUQERY的文件的路径也写在里面。

1 using System;2 using System.Collections.Generic;3 using System.Linq;4 using System.Web;5 6 ///

7 ///JqueryBasicPage 的摘要说明8 /// 9 public class JqueryBasicPage : System.Web.UI.Page10 {11 public string jQueryScriptBlock = @"<script type=""text/javascript"" src=""Script/jquery-1.3.2.min.js""></script>";12 public string jqueryUI = @" <script src=""Script/jquery-ui-1.7.2.custom.min.js"" type=""text/javascript""></script>";13 public JqueryBasicPage()14 {15 //16 //TODO: 在此处添加构造函数逻辑17 //18 19 }20 21 public string ShowMessageBox(string messageInfo)22 {23 string regScriptString = @"<script language=javascript>$(document).ready( function(e) { $('#simplemodal-container').modal(); } ) </script>";24 this.ClientScript.RegisterClientScriptBlock(GetType(), "_error", regScriptString);25 return messageInfo;26 }27 28 29 public string MessageBox(string message)30 {31 System.Text.StringBuilder strString = new System.Text.StringBuilder();32 //先定义CSS样式33 strString.Append(" ");39 //JS40 strString.Append(" <script type='text/javascript'> ");41 strString.Append(" $(function() { ");42 // strString.Append(" $('#pMessage').append('" + message + "'); ");43 strString.Append(" $('#dialog').dialog({ ");44 strString.Append(" closeOnEscape: true, ");45 strString.Append(" modal: true, ");46 strString.Append(" autoOpen: true, ");47 strString.Append(" width: 260, ");48 strString.Append(" heigh:100,");49 strString.Append(" buttons: { ");50 strString.Append(" '确定': function() { ");51 strString.Append(" $(this).dialog('close'); ");52 strString.Append(" }");53 //strString.Append(" '取消': function() { ");54 //strString.Append(" $(this).dialog('close'); ");55 //strString.Append(" } ");56 //strString.Append(" '跳转': function() { ");57 //strString.Append(" $(this).dialog('close'); ");58 // strString.Append(" } ");59 strString.Append(" } ");60 strString.Append(" }); ");61 strString.Append(" $('#dialog').dialog('false'); ");62 strString.Append(" return false; ");63 strString.Append(" $('#dialog_link, ul#icons li').hover( ");64 strString.Append(" function() { $(this).addClass('ui-state-hover'); }, ");65 strString.Append(" function() { $(this).removeClass('ui-state-hover'); } ");66 strString.Append(" ); ");67 strString.Append(" }); ");68 strString.Append(" </script> ");69 //弹出窗体70 strString.Append(" ");71 strString.Append("

"+message+"

");72 strString.Append("

声明:希维路由器教程网提供的内容,仅供网友学习交流,如有侵权请与我们联系删除,谢谢。ihuangque@qq.com
本文地址:https://www.ctrlcv.com.cn/diannao/169348682111067.html