Javascript 如何在单击Iframe中的锚定标记时执行jQuery函数

我的应用程序中有一个网页，在该网页上加载了一个iframe。 iframe显示在应用程序中创建的自定义文档。iframe名称是动态生成的，内容由自定义Javascript框架加载。 该文件有两个主要的垂直部分。 第一个垂直部分具有显示给用户的页面列表，以便用户可以导航到第n页

<iframe id="xyz15031550Iframe0" name="xyz15031550Iframe0" scrolling="no" src="/displaydocument/2339389/15031550?doc=100" style="height: 989px;" width="1277px" height="963px" frameborder="0">

<div class="containerFull">

<div class="allPages" id="allPages">

   <a class="pagenumber_001" href="/document/2339389/15031550">Page 1</a>
   <a class="pagenumber_002" href="/document/2339389/15031550">Page 2</a>
   <a class="pagenumber_003" href="/document/2339389/15031550">Page 3</a>

</div>
<div id="pagesArea">
  <div class="docPage" id="page_body_001">
    <div id="docPageSection-001-1">
      PAGE CONTENT
    </div>
  </div>
</div>
</div>
</iframe>

页面内容

页面加载时，iframe将显示第1页

通过单击锚定标记，用户可以导航到任何页面。单击锚定标记后，iframe将重新加载页面详细信息，并发送到后端

由于一些页面的宽度更大，用户不希望出现水平滚动，所以我调整了iframe容器和两个div的宽度，以使它们正确地显示在窗口上

`

//上面的脚本包含一个名为updateView的jQuery函数，基本上
//具有与css相关的jQuery语句。
jQuery（window）.on（'load'，function（）{
setTimeout（updateView，100）；//超时用于等待iframe完全加载
});

`

我面临的问题是updateView在页面加载时只触发一次。在随后重新加载Iframe时，不会调用updateView。这是因为我没有加载整个页面。我还有其他的div在iframe之上，它们是常量。让我知道如何在每次重新加载iframe内容时触发updateView

我尝试在锚点击事件上添加onclick函数，但它只工作一次。我不知道为什么

<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>

jQuery(window).on('load', function () {
    // use setTimeout() to execute
    // Setting the timeout to zero as no delay is experienced in this page.
    setTimeout(updateView, 0);

    jQuery("div[id^='artifactDiv']").find("iframe[id^='xyz']").contents().find("a[class^='pagenumber']").on('click', function() {
        setTimeout(updateView, 1000);
    });

    jQuery("div[id^='artifactDiv']").find("iframe[id^='xyz']").contents().find("div[id^='docPageSection']").on('load', function() {
        setTimeout(updateView, 1000);
    });
});

jQuery（window）.on（'load'，function（）{
//使用setTimeout（）执行
//将超时设置为零，因为此页面没有延迟。
setTimeout（updateView，0）；
jQuery（“div[id^='artifactDiv']”）.find（“iframe[id^='xyz']”）.contents（）.find（“a[class^='pagenumber']）。on（'click'，function（））{
setTimeout（updateView，1000）；
});
jQuery（“div[id^='artifactDiv']”）.find（“iframe[id^='xyz']”）.contents（）.find（“div[id^='docPageSection']”）on（'load'，function（）{
setTimeout（updateView，1000）；
});
});

请帮帮我。如果我做错了什么，请纠正我。

---

提前谢谢

如何将

onload

属性添加到iframe中并从那里调用

updateView（）

<iframe onload="setTimeout(function() { updateView(); }, 1000);" id="xyz15031550Iframe0" name="xyz15031550Iframe0" scrolling="no" src="/displaydocument/2339389/15031550?doc=100" style="height: 989px;" width="1277px" height="963px" frameborder="0"></iframe>

您可以使用iframe内部的来触发更新：

$(function() { 
  // iframe in main page   
  $('iframe').on('load', function() {

     updateView()// first load update

    // reference to window and document inside frame
    var win = this.contentWindow || this,
      doc = this.contentDocument || this.contentWindow.document;

    // have to use iframe version of jQuery
    win.$(doc).ajaxComplete(function(event, xhr, settings) {
      // fires every time an ajax request completes in iframe
      updateView()
    });
  });
});

---

您是否在iframe中使用jQuery

$.ajax

加载新内容？@charlietfl是的，自定义javascript框架使用ajax和prototype.js作为基础。能否在iframe中添加ajaxSuccess全局处理程序？@charlietfl我认为这是不可能的。我们对同一个文件有几个依赖项。我们能否避免编辑Iframe创建部分？另外，我注意到页面底部有一个无关的关闭标记。我建议把它去掉。谢谢。我把它拿走了。谢谢你保存我的。现在，每次单击锚点时，它都会触发updateView函数。谢谢

$(function() { 
  // iframe in main page   
  $('iframe').on('load', function() {

     updateView()// first load update

    // reference to window and document inside frame
    var win = this.contentWindow || this,
      doc = this.contentDocument || this.contentWindow.document;

    // have to use iframe version of jQuery
    win.$(doc).ajaxComplete(function(event, xhr, settings) {
      // fires every time an ajax request completes in iframe
      updateView()
    });
  });
});