Question

我在html文件中包含了一个js文件，该文件在iframe中被调用。我正在寻找一个jquery函数来替换在iframe外部声明的jquery函数在iframe中调用的js的执行。

例如，我们在iframe中有菜单，它会滑动到具有parallex效果的部分。我只是希望链接到幻灯片的jquery函数不能在iframe内的js文件中声明。

让我们说下面的html代码在iframe中：

<div class="collapse navbar-collapse">
    <ul class="nav navbar-nav navbar-right" id="nitsmenu" data-nitspagelabel="1">
        <li class="scroll active"><a href="#navigation">Home</a></li>
        <li class="scroll"><a href="#aboutus">About Us</a></li>
        <li class="scroll"><a href="#services">Services</a></li>
        <li class="scroll"><a href="#ourteam">Our Team</a></li>
        <li class="scroll"><a href="#portfolio">Portfolio</a></li>
        <li class="scroll"><a href="#clients">Clients</a></li>
        <li class="scroll"><a href="#blog">Blog</a></li>
        <li class="scroll"><a href="#contact">Contact</a></li>
    </ul>
</div>

现在它有一个main.js文件，其中包含以下代码：

$('.navbar-collapse ul li a').click(function () {
    $('html, body').animate({
        scrollTop: $(this.hash).offset().top - 79
    }, 1000);
    return false;
});

现在我希望它处于编辑模式，用户点击ul部分会出现一个按钮，编辑菜单顺序或删除或添加它。所以我尝试在父editor.js文件中执行以下步骤：

$('#nitseditpreview').load(function () { //The function below executes once the iframe has finished loading
    var menu = $(this).contents().find('#nitsmenu');
    all_li = $(this).contents().find('ul#nitsmenu > li');
    $(all_li).find("a").removeAttr("href");
    $(all_li).find("a").css({
        'color': '#000'
        , 'background-color': 'none'
    });
    menu.hover(function (event) {
        $(this).css('border', 'solid 2px #8080ff');
    }, function () {
        $(this).css('border', 'none');
    });
    $(this).click(function (e) {
        stop(); // where this prevents default or stops the event called in main page of js
       //....executes the function....
    });
 });

我想停止使用main.js中使用的功能。但是当它在iframe之外时我又需要main.js文件。

Answer 1

由于您在评论中说明您无法在同一帧中使用编辑器和预览，因此我建议您告诉内部框架它正在编辑以及要做什么或不做什么，因为例如，通过从外部设置某个标志。

这可以使用如下代码（在外框中）来实现：

$('#nitseditpreview').get(0).contentWindow.myDebugMode = true;

然后，内框只需要检查if(window.myDebugMode)以查看是否设置了标志以禁用动画，例如。

如何在iframe中停止jquery函数

1 个答案: