高级弹出层(内容)


代码
<body>
	<button id="demo" class="button blue">自定义内容样式</button>
	
	<!--请将正常编写的html代码复制到模板引擎下,这样就不用js拼接html代码了-->
	<!--注意:模板引擎是写在<body></body>中的-->
	<script id="html" type="text/javaex-template">  
		<!--模板引擎中的html若想调用js函数,需要直接设置onclick才行-->
		<!--模板引擎中调用的js函数不要写在模板引擎中-->
		<input type="button" onclick="test()" class="button green full" value="测试" />
	</script>
</body>

<script>
	$("#demo").click(function() {
		javaex.dialog({
			type : "html",
			fill : "auto",
			title : "我是标题",
			content : $("#html").html(),	// 根据模板引擎的id获取内容
			// scriptArr : ["../javaex/m/js/common.js"],	// 需要加载的JS数组
			isShowCloseBtn : true			// 是否显示底部的关闭按钮
		});
	});
	
	// 模板引擎中的按钮会调用该函数
	function test() {
		javaex.tip({
			content : "我是提示层"
		});
	}
</script>
参数说明(使用属性默认值时,可以缺省该属性)
序号 属性名 默认值 说明
1 type 弹出层类型。必须填 html
2 fill auto 弹出层高度
auto:根据内容自适应弹出一定高度
100%:撑满整个屏幕
10%、13%...(数值自定义):弹出高度距离顶部差百分之多少
3 title 弹出层的标题。没有标题时,不显示标题栏
4 content 弹出层的内容。如果内容过多,推荐使用示例中的模板引擎编写html代码。也可以自己用JS拼接html代码
5 scriptArr 需要加载的js(数组形式)
因为后拼接的html代码无法使用页面一开始加载的js来对css样式进行控制,所以需要再次加载必要的js
额外加载的js只需填写路劲即可,以数组形式
6 isShowCloseBtn true 是否显示底部的关闭按钮
演示