javascript - .load() 没有从 html 文件中提取内容

标签 javascript jquery

我一直在使用 jQuery 文档,并且我正在尝试设置一种情况,其中模式的内容是从单独的 html 文件填充的。所有文件都位于同一域、同一文件夹中。到目前为止,模式将在单击时启动,但没有从 html 文件中提取任何内容。我正在使用 Zurb Reveal 作为模态。

jQuery:

$('.video-btn').click(function (e) {
    e.preventDefault();
    var modalUrl = $(this).attr('href');
    $('#myModal').load('modalUrl #vidModal').reveal({
        animationspeed: 500,
        animation: 'fadeAndPop',
        dismissmodalclass: 'close-reveal-modal'
    });

    //$('.video-wrapper').children().show();
});

链接

<a href="modal1.html" class="info-btn video-btn">
     <h2>Video</h2>
     <p>Cambridge at a glance</p>
</a>

/*Outer modal hidden on page*/
<div id="myModal" class="reveal-modal"></div>/*Content that is in a file named modal1.html*/
<div id="vidModal" class="reveal-modal">
    <div class="inner-modal">
        <div class="modal-head">
            <h2>Video</h2>
            <p>Cambridge at a glance</p>
            <a class="close-reveal-modal"></a>
        </div>
        <div class="modal-share-btns"></div>
        <div class="video-wrapper">
            <iframe id="vid" src="http://player.vimeo.com/video/20800836?api=1" width="700" height="400" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
        </div>
    </div>
    <!-- /inner-modal -->
</div>

最佳答案

您的代码应如下所示:

$('#myModal').load(modalUrl+'#vidModal')

在您的代码中,您加载网址 modalUrl #vidModal,而不是存储在 modalUrl 中与 #vidModal 连接的网址

(根据评论更新)

关于javascript - .load() 没有从 html 文件中提取内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14585679/

相关文章:

jquery - 一个接一个地动画化两个 Div

javascript - alasql导出的excel公式不起作用

javascript - 如何将包含 JSON 的 JSON NSString 从 Objective C 方法传递给 Javascript 方法

javascript - 下载uri图像时本地镜像需要很长时间才能加载 - React Native

javascript - 使用 jimp 在 Node.js 中调整图像大小并获取新图像的路径

php - Ajax请求显示完成但数据未提交

javascript - 仅在移动设备中加载脚本不起作用

javascript - 使用 SystemJS 加载 CycleJS

javascript - 如何正确压缩 Jquery 和大量插件?

javascript - 如何为移动设备制作固定的 div,但在单击时用滚动填充视口(viewport)