`
wufan0023
  • 浏览: 29679 次
  • 性别: Icon_minigender_1
  • 来自: hefei
社区版块
存档分类
最新评论

JQuery UI Dialog使用样例

 
阅读更多

 

<!--  ready事件的简写 -->
$(function(){

    //确认删除对话框
	$( "#dialog" ).dialog({
		 buttons: { "是": function() { 
		   var checkeboxs = $(".cbTable");	
		   $("#deleteDetail").attr('value',getCheckedCheckBoxValue(checkeboxs))
		   $("#fmDeleteUser").submit();
		 
		 } ,
		 "否": function() { $(this).dialog("close");}
		 },
		 draggable: false,
		 disabled: true ,  //是否可以移动,true不可以
		 resizable: false , //是否可以变化大小
		 autoOpen: false,  //显示窗口
		  modal: true // 背后内容是否可以操作开关,true不可以
		 });
	
	//未选择删除项对话框
	$( "#dialog_err" ).dialog({
		 draggable: false,
		 disabled: true ,
		 resizable: false ,
		  modal: true ,
		 autoOpen: false

	});


	$( "#btDelete" ).click(function(){
	    
		// 判断是否有内容被选中
	    var checkeboxs = $(".cbTable");		
		if(hasCheckedCheckBox(checkeboxs)){
			 $( "#dialog" ).dialog({ autoOpen: true });
		}else{
			 $( "#dialog_err" ).dialog({ autoOpen: true });
		}  
	});
});

/*找有没有被选中的checkbox*/
function hasCheckedCheckBox(checkboxs){
    var hasChecked = false
    $(checkboxs).each(function(){	   
	   if($(this).attr("checked")=='checked'){
	     hasChecked = hasChecked || true;
	   }
	});
	return hasChecked;
}

/*找有没有被选中的checkbox*/
function getCheckedCheckBoxValue(checkboxs){
   var values = "";
    $(checkboxs).each(function(){	   
	   if($(this).attr("checked")=='checked'){  // checkbox中北选中的
	     values = values + $(this).attr("idV") + ",";
	   }
	});
	return values;
}
 

 

分享到:
评论

相关推荐

    jQuery UI 的精彩实例

    **jQuery UI 精彩实例详解** jQuery UI 是一个基于 jQuery JavaScript 库的用户界面插件集合,它提供了丰富的交互...在 lwme-jqueryui-demo 压缩包中,包含了更多实际的演示和代码,帮助你进一步探索和应用这些知识。

    最新JQuery UI 1.8.2 内含实例及Jquery 1.4.2

    - 包含的实例可以帮助开发者快速理解和应用 jQuery UI 的各种功能,通过示例代码了解如何在实际项目中使用这些组件。 - 实例涵盖了基础用法到复杂交互,有助于提高开发技能和理解库的潜力。 7. **兼容性与跨平台*...

    jQuery dialog对话框插件点击弹出对话框代码

    在使用jQuery dialog之前,你需要先引入jQuery库和jQuery UI库。通常,这可以通过在HTML文件中添加以下链接来完成: ```html &lt;script src="https://code.jquery.com/jquery-3.6.0.min.js"&gt;&lt;/script&gt; ...

    jquery-ui-1.8.5.custom

    在 "development-bundle" 中,你可以找到所有组件的源文件,通过在线构建工具(如 http://jqueryui.com/download/)选择需要的组件并生成对应的压缩文件。 四、主题Roller jQuery UI 支持主题Roller,这是一个可视...

    Easy UI前端框架

    `jquery_easyui_开发手册中文解析.doc` 提供了Easy UI的开发指南,用中文详细解析了如何使用该框架进行网页开发,包括安装、基础用法、组件使用等。 `Jquery_easyui_datagrid_js导出excel.doc` 专门讲解了如何利用...

    easyui示例样例.7z

    EasyUI 是一个基于 jQuery 的 UI 组件库,它为开发者提供了丰富的前端界面组件,使得构建交互式的、美观的Web应用程序变得更加便捷。这个"easyui示例样例.7z"压缩包显然包含了EasyUI的示例代码,可以用于学习和参考...

    JQuery 办公系统框架可应用于CRM系统

    - **对话框和模态框**:jQuery UI的Dialog组件提供了一种优雅的方式展示弹窗或模态框,适用于CRM中的确认、提示等交互场景。 - **动画效果**:jQuery的动画功能可使CRM系统中的过渡效果更加平滑,例如在加载数据或...

    web桌面主题特效代码

    Jquery-UI是一个开源的JavaScript库,它是基于Jquery基础之上的,提供了丰富的用户界面组件,如对话框(Dialog)、日历(Datepicker)、拖放(Draggable)和可排序(Sortable)功能等。Jquery-UI的设计目标是使...

    模仿MSN弹出对话框

    在IT领域,模仿MSN弹出对话框是一种常见的用户界面(UI)设计实践,它涉及到前端开发中的交互设计和编程技术。MSN(Microsoft Network)是一款曾经非常流行的即时通讯软件,其简洁明了的对话框设计对后来的聊天应用...

    easyui帮助文档

    1. **组件库**:EasyUI 提供了多种UI组件,如对话框(Dialog)、面板(Panel)、表格(Grid)、树形控件(Tree)、下拉菜单(Combobox)、日期选择器(DatePicker)等,这些组件可以快速构建出功能齐全的界面。...

    easyui.zip

    1. **组件库**:EasyUI 包含了大量的 UI 组件,如 Dialog(对话框)、Panel(面板)、Layout(布局)、Grid(表格)、Tree(树形结构)、Menu(菜单)和 Tabs(标签页)等。这些组件都具有丰富的功能和可定制的样式...

    EasyUI后台管理系统

    在"完整后台管理界面EasyUI"这个文件中,可能包含了EasyUI框架的所有组件和样例代码,帮助开发者快速理解和学习如何使用EasyUI来构建后台管理系统。通过这个文件,你可以实际操作和体验EasyUI的各种功能,从而更好地...

Global site tag (gtag.js) - Google Analytics