jquery - Boostrap - show.bs.modal - 获取“href”
问题描述
我希望<object data="">
在触发 BS 模式链接时将 PDF URL 加载到属性中。PDF 的 URL 来自该模式链接的 href。
以下是我从以下问题改编的代码。
Bootstrap 3 - 如何通过 AJAX 在模态正文中加载内容?
<a href="https://www.example.com/test.pdf" data-remote="false" data-toggle="modal" data-target="#myModal"">
<!-- The Modal body for the press item -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
<object data="" type="application/pdf" width="100%" height="100%">
<param name="view" value="Fit"></object>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<script>
jQuery("#myModal").on("show.bs.modal", function(e) {
var link = jQuery(e.relatedTarget);
jQuery(this).find(".modal-body object").attr("data",link);
});
</script>
以上将“[object Object]”加载到数据属性中。
我尝试过的另一种方法是:
<script>
jQuery("#myModal").on("show.bs.modal", function(e) {
var link = jQuery(e.relatedTarget.href);
jQuery(this).find(".modal-body object").attr("data",link);
});
</script>
并且:
<script>
jQuery("#myModal").on("show.bs.modal", function(e) {
var link = jQuery(this).attr("href"));
jQuery(this).find(".modal-body object").attr("data",link);
});
</script>
解决方案
href
我可以通过添加从对象中检索属性的第二个变量来做到这一点:
jQuery("#myModal").on("show.bs.modal", function(e) {
var target = jQuery(e.relatedTarget);
var link = target.attr("href");
jQuery(this).find(".modal-body object").attr("data",link);
});
推荐阅读
- angular - Angular 模板驱动的表单验证:我应该发布 ngModel 还是 form.value?
- java - 添加了 CSV 导出小数点
- javascript - 如何使用javascript从firebase获取特定孩子的所有值?
- c# - 在 EF 6 中模拟 DBContext 无法按预期工作
- java - Fragment 为 onCreateView 时从 Activity 向 Fragment 发送数据
- jquery - 如何知道 Web 应用程序使用哪些框架或库
- java - Git winmerge 弹出“选择文件和文件夹”出现
- r - 在 group_by 之后使用子数据集
- jquery - Cheerio jquery node js:获取href值
- swift - Swift Xcode,登录后如何导航到视图控制器