码迷,mamicode.com
首页 > Web开发 > 详细

JS 功能弹框封装

时间:2016-10-26 19:10:11      阅读:215      评论:0      收藏:0      [点我收藏+]

标签:function   ack   can   font   using   pen   end   dcl   var   

// 功能提示弹框
function messageBox ( option ) {
	var html = ‘‘;
	html += ‘<div class="message-box-head">‘ + option.title;
	html += ‘<i class="icon iconfont message-close"></i></div>‘;

	if ( option.type == ‘using‘ ) {
		html += ‘<div class="message-box-body">‘;
		html += ‘<p class="message-prompt">‘ + option.content + ‘</p>‘;
		html += ‘</div>‘;
	}
	else if ( option.type == ‘disable‘ ) {
		html += ‘<div class="message-box-body">‘;
		html += ‘<p class="message-prompt">‘ + option.content + ‘</p>‘;
		html += ‘</div>‘;
	}
	else if ( option.type == ‘confirm‘ ) {
		html += ‘<div class="message-box-body reset-pwd">‘;
		html += ‘<p class="message-prompt">‘ + option.content + ‘</p>‘;
		html += ‘<div class="message-btn por">‘;
		html += ‘<button class="btn-common btn-gray cancel-btn poa">取消</button>‘;
		html += ‘<button class="btn-common btn-blue yes-btn poa">确定</button>‘;
		html += ‘</div>‘;
		html += ‘</div>‘;
	}
	else if ( option.type == ‘confirm2‘ ) {
		html += ‘<div class="message-box-body confirm-spec">‘;
		html += ‘<div class="message-prompt">‘;
		html += ‘<p>‘+ option.contentTitle +‘</p>‘;
		html += ‘<p>‘+ option.content +‘</p>‘;
		html += ‘</div>‘;
		html += ‘<div class="message-btn por">‘;
		html += ‘<button class="btn-common btn-gray cancel-btn poa">取消</button>‘;
		html += ‘<button class="btn-common btn-blue yes-btn poa">确定</button>‘;
		html += ‘</div>‘;
		html += ‘</div>‘;
	}

	$(".message-box-main").empty().append(html);
	$(".message-box").addClass(‘show‘);

	// 点击取消事件
	$(".cancel-btn").click(function () {
		$(".message-box").removeClass(‘show‘);
		if ( option.cancel ) {
			option.cancel();
		}
	});

	// 点击确定事件
	$(".yes-btn").click(function () {
		$(".message-box").removeClass(‘show‘);
		if ( option.sureFun ) {
			option.sureFun();
		}
	});

	// 点击图标取消事件
	$(".message-close").click(function () {
		$(".message-box").removeClass(‘show‘);
		if ( option.callBack ) {
			option.callBack();
		}
	});


}

  

  

JS 功能弹框封装

标签:function   ack   can   font   using   pen   end   dcl   var   

原文地址:http://www.cnblogs.com/zsongs/p/6001194.html

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