我有一个Index.Html文件,我想在bootstrap模式中打开而不退出模态本身。基本上充当内部链接。我试图使用ASP.net mvc这样做。这个位置是从Captivate 9生成的,我试图将一张幻灯片作为样本添加到Modal中
使用Javascript:
var modal3 = document.getElementById('myModal3');
var img3 = document.getElementById('myImg3');
var modalImg3 = document.getElementById("img03");
img3.onclick = function () {
modal3.style.display = "block";
}
var span = document.getElementsByClassName("close")[2];
span.onclick = function () {
modal3.style.display = "none";
}
模态:
<div id="myModal3" class="modal">
<span class="close" style="color:white">×</span>
</div>
答案 0 :(得分:1)
我写的与此类似的东西是使用Ajax。我不确定你想走这条路,但至少值得一试!你需要添加的是你点击的某个元素上的btnCreate id,它应该可以工作!
<!-- modal placeholder-->
<div id='myModal' class='modal fade in'>
<div class="modal-dialog">
<div class="modal-content">
<div id='myModalContent'></div>
</div>
</div>
</div>
html about只是您要加载的内容的占位符。
此脚本只是打开窗口并加载内容。几乎从你的控制器拦截它。这可以是您想要加载到此模态窗口的PartialView!
$(function () {
$.ajaxSetup({ cache: false });
$("body").on("click", "#btnCreate", function (e) {
$('#myModalContent').load(this.href, function () {
$('#myModal').modal({
backdrop: 'static',
keyboard: true
}, 'show');
bindForm(this);
});
return false;
});
});
然后关闭模态窗口。
function bindForm(dialog) {
$('form', dialog).submit(function () {
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
if (result.success) {
$('#myModal').modal('hide');
} else {
$('#myModal').modal('hide');
}
}
});
return false;
});
}