lhgdialog弹窗带确定取消按钮用法

分手后的思念是犯贱 2024-04-18 21:42 73阅读 0赞

1、引入lhgdialog库

2、示例代码

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8" />
    		<title>lhgdialog</title>
    		<script src="js/lhgdialog/jquery.min.js"></script>
    		<script src="js/lhgdialog/lhgdialog.min.js?skin=izhdw"></script>
    	</head>
    	<body>
    		<button>lhgdialog弹窗带确定取消按钮</button>
    	</body>
    	<script>
    		$("button").click(function (){
    			 $.dialog({
    			title: '带确定取消按钮的弹窗',
    			content: 'url:content.html',
    		    ok: function(){
    		    	iframe = this.iframe.contentWindow;
    				saveObj();
    				return false;
    		    },
    		    cancelVal: '关闭',
    		    cancel: true /*为true等价于function(){}*/
    		});
    		/*
    			回调函数
    			该函数可以调用dialog中弹窗页面中的方法
    		*/
    		function saveObj(){
    			iframe.test();//test是页面内容中的js方法
    		}
    		})
    	</script>
    </html>

3、窗体内容页面

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>内容</title>
    	</head>
    	<body>
    		<h3>我是内容</h3>
    	</body>
    	<script>
    		function test(){
    			alert("我是内容页面中的弹窗");
    		}
    	</script>
    </html>

4、效果图

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTU1NDkw_size_16_color_FFFFFF_t_70][]

5、代码

代码请移步到百度云网盘下载：

链接：https://pan.baidu.com/s/19SzQy\_0gjk7QU\_7jSR5DjA   
提取码：4slv   
复制这段内容后打开百度网盘手机App，操作更方便哦

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTU1NDkw_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/18/87cd2aeb888c44bf9168b2754a286e23.png