如何使用引导程序打开所有的链接

I'd like to be able to open all links on a page in a modal.

我希望能够以模态打开页面上的所有链接。

Below is an example:

下面是一个例子:

<a href="http://google.com.au">Google AU</a>
<a href-"http://google.com">Google US</a>
<a href="https://www.google.co.jp>Google JP</a>

I want these links to open a Bootstrap Modal iFrame, loading the href= website into the modal. We have hundreds of links on the home page (all within our own domain) that are currently opening in a new tab when clicked, but instead we want to be able to open them into a modal, similar to how MaterializeCSS does it:

我希望这些链接打开一个引导模式iFrame，将href=网站加载到模式中。我们在主页上有数百个链接(都在我们自己的域内)，这些链接在点击时正在一个新标签中打开，但是我们希望能够将它们打开到一个模态，类似于它是如何实现的:

<div aria-hidden="true" class="modal fade" id="rs1" role="dialog" tabindex="-1" style="display: none;">
    <div class="modal-dialog modal-full">
        <div class="modal-content">
            <iframe class="iframe-seamless" src="https://google.com.au" title="Google AU"></iframe>
        </div>
    </div>
</div>

Without coding in all the modal <div id="unique"> these links would not work, so is it possible to use Javascript to automatically make all links on the page open into the modal?

如果没有在所有的模态

中编码，这些链接将无法工作，那么是否可以使用Javascript将页面上的所有链接自动打开到模态中?

Thanks

谢谢

1 个解决方案

#1

First you should create an empty modal, the content will be filled based on the link that is clicked. Following Javascript should help achieve this. I have not tested it but it should look something like this.

首先，您应该创建一个空的模式，内容将根据单击的链接来填充。遵循Javascript应该有助于实现这一点。我还没有测试过，但是应该是这样的。

$('a').click(function() { 
   $('#myModal .modal-content').html('<iframe src="' + $(this).attr('href') + '"></iframe>'); 
   $('#myModal').modal('show');
});