adminLTE模态框弹出页面样例[通俗易懂]

adminLTE模态框弹出页面样例[通俗易懂]项目中引用adminLTE前端框架,弹出页面是模态框方法,下面是某个detail.html文件<divclass=”modalfade”id=”viewDialog”role=”viewDialog”aria-hidden=”true”><divclass=”modal-dialogmodal-full”>&l…


Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

项目中引用adminLTE前端框架,弹出页面是模态框方法, 下面是某个detail.html文件

<div class="modal fade" id="viewDialog" role="viewDialog" aria-hidden="true">
        <div class="modal-dialog modal-full">
           <div class="modal-content">
              <div class="modal-header" style="padding:10px !important;padding-bottom:5px;border-bottom:0px !important;">
			    <input type="button" value="上一张" onClick="javascript:maskprev(this)" style="margin-left:185px;">
			    <input type="button" value="下一张" onClick="javascript:masknext(this)" style="margin-left:60px;">
	            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
	         </div>
              <div class="modal-body mask-layer-imgbox" style="padding-top:0px;text-align:center;"><!-- height:480px;width:600px -->
                 
              </div>
           </div>  
           <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
     </div>

点击某个按钮或链接,弹出模态框 

<a data-toggle=”modal” onClick=”javascript:viewFile()” href=”#” data-target=”#viewDialog”>派遣</a>

<script> 
function viewFile() {

	$('#viewDialog').modal({
	     backdrop:"static",
	     keyboard:false,
	     show: true
	});
}
</script>

js弹出模态框还有一种写法

function showPage() {
	 $('#viewDialog').off().on('shown.bs.modal', function(){
	    //...处理一些前台传值等

 	}); 
}

展示效果如下 :

adminLTE模态框弹出页面样例[通俗易懂]

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/164547.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长

相关推荐

  • windows自动关机命令_windows取消自动关机命令

    windows自动关机命令_windows取消自动关机命令##设置定时关机bat####1.首先在桌面新建一个记事本txt####2.打开记事本,输入shutdown-s-t1260;1260是指1260秒,即21分钟内关机。可以修改成别的时间

    2022年8月4日
  • robotium android,Robotium 测试Android apk安装包

    robotium android,Robotium 测试Android apk安装包介绍要测试apk程序必须和我们编写的测试程序拥有相同的签名(signature)。如果没有apk程序的签名秘钥,就要去除apk程序的签名,然后再使用自己的key对其签名(这一步中,我们可以使用debugkey),已经有现成的工具可用,下载地址re-sign.jar,这个工具可以去掉apk程序的原签名,然后使用我们自己的debugkey对其签名。详细编写测试用例之前,我们需要知道apk程序的包名…

    2022年7月25日
  • iis无法启动万维网发布服务W3SVC「建议收藏」

    iis无法启动万维网发布服务W3SVC「建议收藏」启动iis时提示无法启动万维网发布服务W3SVC,方法:Win+R,输入service.msc,找到WindowsProcessActivationService服务,将该服务启动;再找到WorldWideWebPublishingService服务,将该服务改为启动,如果提示“错误1068:依赖服务或组无法启动”,就尝试这两种方法:1、打开控制面板,程序,程序和功能,启用或关闭windows功能,找到windowsprocessactivationservice,全部勾选,重启电

    2022年11月2日
  • vbs代码之“电脑系统崩溃”「建议收藏」

    vbs代码之“电脑系统崩溃”「建议收藏」熟练掌握vbs脚本,可以让你…我也不知道。具体操作:新建文本文档,将本段代码复制进入文本,保存;将后缀.txt改为.vbs即可。codeCreateObject(“SAPI.SpVoice”).Speak”你的电脑受到ddos木马攻击,系统严重瘫痪,电脑系统将在三秒后崩溃”setWshShell=WScript.CreateObject(“WScript.Shell”)WScript.Sleep2000CreateObject(“SAPI.SpVoice”).Speak”电脑系统已

    2022年5月27日
  • java对接第三方接口「建议收藏」

    java对接第三方接口「建议收藏」1.准备与第三方接口对接的账号配置到了Apollo上面@Value(“${taofake.appId}”) privateStringappId; @Value(“${taofake.url}”) privateStringurl; @Value(“${taofake.appSecret}”) privateStringappSecret;2.准备用于接受接…

    2022年6月9日
  • document.documentElement.clientHeight「建议收藏」

    document.documentElement.clientHeight「建议收藏」于获取各种浏览器可见窗口大小的一点点研究functiongetInfo(){vars=””;s=”网页可见区域宽:”document.body.clientWidth;s=”网页可见区域高:”document.body.clientHeight;s=”网页可见区域宽:”document.body.offsetWidth”(包括边线和滚

    2022年9月10日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号