jQuery 插件 jQuery UI的使用

首先：下载jQuery UI 所需要的包。放到项目里。

 

<link href="css/style.css" rel="stylesheet" type="text/css" />

<link href="jquery/themes/redmond/jquery-ui-1.8.1.custom.css" rel="stylesheet" type="text/css" />

<script  src="jquery/jquery-1.4.2.min.js" type="text/javascript"></script>

<script  src="jquery/jquery-ui-1.8.1.custom.min.js" type="text/javascript"></script>

<script  src="jquery/jquery.tablesorter.min.js" type="text/javascript"></script>

 

 

引入jQuery 所需要js和css 。

 

1. 新增对话框

 

$(".add_dialog").click(function(){

          $(".dialog").load($(".add_dialog").attr("href"),{"xx": Math.random()}, function(){

        $(this).dialog({

title: "新增用户",     //对话框的标题

autoOpen: false,      //自动打开:true

bgiframe: true,       //是否解决IE6下无法遮盖select的问题:false

closeOnEscape: false, //使用ESC关闭dialog:true;

width: 500,

modal: true,          //是否为模态: false

resizable: false      //是否可以调整大小: true

}).dialog('open');

     });

 return false;

});

 

<a id="add_dialog" class="add_dialog" title="新增用户" href="actions/userAction!toAdd">新增用户</a>

 

<div id="dialog" class="dialog" style="display: none"></div>