jsp自定義alert
1、建立彈出框div
<!--彈出框--------------------------->
<div id="alert_div" align="center">
<div align="left">操作提示</div>
<div align="center">context</div>
<div align="right">
<!-- <a href="javascript:;">確定</a> -->
<button id="alertbutton">確定</button>
</div>
</div>
2、定義樣式以及初始化隱藏alert
<script type="text/javascript">
$(function(){
$('.background,#alert_div').hide();
//position:fixed; absolute
$('#alert_div').css('width',300).css('height',120).css('border','0.1px solid #666666')
.css('position','fixed').css('left',$(this).width()/2.5).css('top',$(this).height()/2.5)
.css('z-index','120').css('background-color','#ffffff').css('border-radius','5px');
$('#alert_div div:eq(0)').css('margin-left','10px').css('margin-top','10px').css('text-decoration','underline');
$('#alert_div div:eq(2)').css('margin-top','25px').css('margin-right','10px');
$('#alert_div div:eq(2) button').click(function(){
$('.background').fadeOut(150);
$('#alert_div').fadeOut(350);
});
$('#alert_div div:eq(1)').css('margin-top','10px');
});
</script>
3、同樣在script裡面。點選事件、設定alert內容。顯示alert
$('#alert_div div:eq(1)')
.text(''+data.msg).css('color','red');
$('#alert_div').fadeIn('150');