首页 > 解决方案 > 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">&times;</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>

标签: jquery

解决方案


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);
        });

推荐阅读