码迷,mamicode.com
首页 > 其他好文 > 详细

用dialog在前台实现一个简单的UI对话框

时间:2017-08-26 23:37:38      阅读:412      评论:0      收藏:0      [点我收藏+]

标签:ext   this   用法   app   item   sub   ice   opener   列表   

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>对话框部件(Dialog Widget)演示</title>
<link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
<script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
</head>
<body>

<button id="opener">打开对话框</button>
<div id="dialog" title="对话框标题">我是一个对话框
<form action="/demo/demo_form.asp">
First name:<br>
<input type="text" name="firstname" value="Mickey">
<br>
Last name:<br>
<input type="text" name="lastname" value="Mouse">
<br><br>
<input type="submit" value="Submit">
</form>
</div>

<script>
$( "#dialog" ).dialog({ autoOpen: false });
$( "#opener" ).click(function() {
$( "#dialog" ).dialog( "open" );
});
</script>

</body>
</html>

 

jquery $.dialog的用法

 

第一种方法:

 function getApparatusLists()

{   

      var url=‘${basePath}worklicense/app/getApparatusList.action?;  //链接   

    $.dialog({

        id:‘testItem‘,     

     content:‘url:‘+url,    //重点,传送参数

       title:‘仪器列表:‘,     

     opacity:0.4,     

     width:600,    

      height:400,     

     lock:true      });   

第二种方法: 把表单中的值传过去

function tt()
 {
   var df = document.thisForm; 
   df.submit();
  
 }
 function getApparatusLists(){
 
     $.dialog({
     id:‘testItem‘,
     content:tt(),  //把表单的值根据表单提交
     title:‘仪器列表:‘,
     opacity:0.4,
     width:600, 
     height:400,
     lock:true
     });
   
   }

用dialog在前台实现一个简单的UI对话框

标签:ext   this   用法   app   item   sub   ice   opener   列表   

原文地址:http://www.cnblogs.com/jiangcm/p/7436588.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!