newbie在这里。在网站上尝试了一些不同的示例,没有任何运气。我的情况是,我们在整个DNN站点(EVOQ 8.5)上都有以下格式的链接。
<a href="www.site.com" class="external-link">
我试图打开一种模式,说您每次单击与外部链接类的链接时都离开我们的网站。我还试图在DNN皮肤文件中实现这一目标,因此它适用于所有页面。这是我现在拥有的。
模态:
<div id="modalExternalLink" class="modal fade">
<div class="modal-dialog">
<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>
<span class="modal-title">Thank you for visiting our site.</span>
</div>
<div class="modal-body">
<p> You are now leaving our website.</p>
<div class="button-container">
<button type="button" id="btnContinue" class="btn-continue" style="margin-right:10px;">Continue</button>
<button type="button" class="modal-button" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
尝试显示模态并将链接的HREF传递到继续按钮:
$('.external-link').click(function(e) {{
e.preventDefault();
var link = (e.relatedTarget).attr('href');
$("#btnContinue").attr('href', link);
$("#modalExternalLink").modal('show');
});
这在我们的环境中不起作用。它直接直接进入链接的HREF URL。我敢肯定,还有其他方法可以做到这一点,但是我们网站上有数百个链接具有我们必须更改的外部链接类,并且必须针对带有不同URL的许多链接打开这种模式。
您在函数的第一行中有额外的{
。这会导致错误,jQuery停止执行,e.preventdefault()永远无法达到,因此将打开链接。因此,您看不到脚本有错误。
第二我将代码包装在$(document).ready(function ()
。
$(document).ready(function () {
$('.external-link').click(function (e) {
e.preventDefault();
//rest of the code
});
});
是否有人偶然发现了这个问题。模态很好,但是我的JavaScript不正确(并且因为我很累而犯了一些愚蠢的错误)。这是最终工作JavaScript:
$(document).ready(function(e){
$('.external-link').on('click', function (e) {
e.preventDefault();
console.log($(e.currentTarget).attr('href'));
document.getElementById( "btnContinue" ).setAttribute( "onClick", ( "javascript:window.location.href="" + $(e.currentTarget).attr('href') + """) );
$('#modalExternalLink').modal('show');
});
});
您显然可以剥离控制台日志。主要问题是e.RelatedTarget又回来了,因此我在那里进行了登录以进行监视。从稍作阅读中,这是Bootstrap 2&amp;3。