模态框的js代码（前端模态框）

今天给各位分享模态框的js代码的知识，其中也会对前端模态框进行解释，如果能碰巧解决你现在面临的问题，别忘了关注本站，现在开始吧！

本文目录一览：

• 1、$('#myModal').modal()这行代码作用是什么？
• 2、js模态框怎么获取点击的按钮是确定还是取消
• 3、php不能控制js弹出模态框

$('#myModal').modal()这行代码作用是什么？

首先js代码分号问题

js代码不加分号可以运行的，但是可能会引起歧义的情况，看个人代码风格吧

modal()问题

这是一段bootstrap 的弹出框的js代码，没有cshtml部份代码是看不出来整段代码的意思。

$('#myModal').modal()是显示弹出框的意思。

$(document).on("click","#change",function(){

$('#myModal').modal()

.....

}

弹出框一般状态都是隐藏的。大概意思是点击 id为 "change"的按钮后，显示id为myModal的弹出框，在弹出框里显示一些东西。

下面一段类似代码解释：

弹出框cshtml代码

编写弹框，设置弹框id为"myModal",弹框头部文本id为"myModalLabel"，模态弹框中内容为一系列输入框。

点击 id为 "btn_add"的按钮时，更改模态框头部文本为新增，弹出模态框。

点击模态框周围空白部份则会关闭它。

//注册新增按钮的事件

$("#btn_add").click(function () {

$("#myModalLabel").text("新增");//更改模态框头部文本为新增

$('#myModal').modal();                //弹出模态框

});

运行结果

不知道是不是版本还是默认参数问题，上网查询的$('#myModal').modal();是有参数的

$('#myModal').modal("show");//显示模态弹框

$('#myModal').modal("hide");//隐藏模态弹框

$('#myModal').modal("toggle");//模态弹框状态反转

js模态框怎么获取点击的按钮是确定还是取消

你可以咋点击SubmitForm方法里面调起模态框，然后模态框里面的两个按钮定义两个方法，一个确认一个取消，然后在确认方法里面取提交你的form；

或者在模态框上定义一个方法，通过传参去判断是确认还是取消，然后在确认方法里面取提交你的form；

php不能控制js弹出模态框

不关PHP的事情，这个控制是JS的问题，或者你可以试试下面的代码，替换一下原本的JS

function login(value)

{

switch(value)

{

case "yes":$('#login_no').css('display','none');$('#login_yes').css('display','block');break;

case "no":$('#login_yes').css('display','none');$('#login_no').css('display','block');break;

}

$('#login_mode').fadeIn('modal');

window.setTimeout("$('#login_mode').hide(500)",2000);

}

模态框的js代码的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于前端模态框、模态框的js代码的信息别忘了在本站进行查找喔。