加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

BootStrap Modal

发布时间:2020-12-17 21:07:48 所属栏目:安全 来源:网络整理
导读:Modal js调用开启: $( '#confirmDilog' ).modal({ ?? ??? keyboard:true, ?? ??? show:true, ??? }); Modal js调用关闭: $( '#confirmDilog' ).modal( ‘hide’ ); .modal('toggle') 手动打开或隐藏一个模态对话框。 $( '#myModal' ).modal( 'toggle' ) .m

Modal js调用开启:

$( '#confirmDilog' ).modal({
?? ??? keyboard:true,
?? ??? show:true,
??? });


Modal js调用关闭:

$( '#confirmDilog' ).modal( ‘hide’ );

.modal('toggle')

手动打开或隐藏一个模态对话框。

 $('#myModal').modal('toggle')

.modal('show')

手动打开一个模态对话框。

  $('#myModal').modal('show')

.modal('hide')

手动隐藏一个模态对话框。

  $('#myModal').modal('hide')

Modal 清除数据:

//Bootstrap v2

 $("#confirmDilog").on("hide",function() {
       $(this).removeData("modal");
  });

//Bootstrap v3

$("#confirmDilog").on("hidden.bs.modal",function() {
         $(this).removeData("bs.modal");
});

BootStrap 自定义Modal?显示剧中:

<!-- 小小提示框  -->
<div id="litModal" style="width:400px;" class="modal fade modal-xs" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
   <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">提示信息</h4>
      </div>
      <div class="modal-body" id="tipDialog"></div>
    </div>
</div>
<!-- 小小提示框  -->

$( '#tipDialog' ).html( '请选选择该角色的权限' );
//设置提示框属性
$('#litModal').modal({
	keyboard:true,show:true,backdrop:false,});
//设置提示框的css样式(居中展示)
$("#litModal").modal().css({
   "margin-top": function () {
      return ($(this).height() / 10 );
   },"margin-left": function () {
      return ($(this).width() / 4 );
    },});

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读