如何在Internet Explorer中暂停JavaScript执行？

Question

I have the following scenario: 我有以下场景：

Main page 主页
Nested page 嵌套页面
Common JS file (which is included in both pages) 常见的JS文件（包含在两个页面中）

The nested page is subsequently loaded into an iframe of the main page. 随后将嵌套页面加载到主页面的iframe中。 Both pages invoke a function from the common JS file on page load. 两个页面在页面加载时从公共JS文件调用函数。

Live demo: 现场演示：
http://www.ecmazing.com/misc/pause-execution/mainpage.html http://www.ecmazing.com/misc/pause-execution/mainpage.html
http://www.ecmazing.com/misc/pause-execution/nestedpage.html http://www.ecmazing.com/misc/pause-execution/nestedpage.html
http://www.ecmazing.com/misc/pause-execution/common.js http://www.ecmazing.com/misc/pause-execution/common.js

The common JS file contains one global function which paints the H1 element red. 常见的JS文件包含一个全局函数，它将H1元素绘制为红色。 I would like to pause execution at the beginning of that function, so that the execution is paused while the H1 element is still black. 我想在该函数的开头暂停执行，以便在H1元素仍为黑色时暂停执行。

How to do it on the main page: 如何在主页面上执行此操作：

This is trivial. 这是微不足道的。 Simply load the page, open the dev tools of the browser, select the common.js file, and set a break-point at the first line of the function. 只需加载页面，打开浏览器的开发工具，选择common.js文件，并在函数的第一行设置断点。 Now, reload the page. 现在， 重新加载页面。 The break-point will persist the reload, and execution will be paused. 断点将持续重新加载，执行将暂停。

How to do it on the nested page: 如何在嵌套页面上执行此操作：

Now, in Chrome and Firefox (Firebug), the break-point that was set above (for the main page), will also work for the nested page. 现在，在Chrome和Firefox（Firebug）中，上面设置的断点（对于主页面）也适用于嵌套页面。 Both pages use the same JS file, and setting a break point in that file will apply for both pages automatically. 两个页面都使用相同的JS文件，并且在该文件中设置断点将自动应用于这两个页面。 Unfortunately, this rule does not apply to IE. 不幸的是，这条规则不适用于IE。

And even worse, even if I set the break point subsequently, and then reload the iframe only , the break-point will not persist. 更糟糕的是，即使我随后设置了断点，然后仅重新加载iframe ，断点也不会持续存在。

So, I don't know how to pause execution for the nested page in IE. 所以，我不知道如何在IE中暂停执行嵌套页面。 Can it be done? 可以吗？ (I'm dealing with this by manually setting a debugger; at the beginning of the function, but I would love to be able to set the break-point via the dev tools in IE, if that's possible.) （我正在通过手动设置debugger;处理这个问题debugger;在函数的开头，但我希望能够通过IE中的开发工具设置断点，如果可能的话。）

Answer 1

The closest I can come to a solution is to set a breakpoint within the loadIFrame() function on the main page and then 'step in' until the nested page's Common.js file is loaded. 我能找到最接近解决方案的方法是在主页面上的loadIFrame（）函数中设置断点，然后“插入”直到加载嵌套页面的Common.js文件。 In a more complicated example you would then be able to set your breakpoints within the new Common.js file and they would work correctly until the next time the iframe is loaded, when they would all be lost again. 在一个更复杂的示例中，您可以在新的Common.js文件中设置断点，它们可以正常工作，直到下次加载iframe时，它们都会再次丢失。

Answer 2

I don't have IE9 to test, but perhaps you can treat common.js file as a separate asset for the iframe page? 我没有IE9进行测试，但也许您可以将common.js文件视为iframe页面的单独资产？ I believe that's why it works in other browsers since those files must be tagged or labeled by the browser some how. 我相信这就是它在其他浏览器中工作的原因，因为这些文件必须由浏览器标记或标记 。

An example is to append ?iframePage to the end of common.js on the iframe page. 一个例子是将?iframePage附加到iframe页面上的common.js的末尾。 At least in Firefox is shows an asset loaded as common.js?iframePage . 至少在Firefox中显示一个加载为common.js?iframePage的资产。 Everything past the query string is ignored by the browser but otherwise the JavaScript is loaded with that exact name. 浏览器会忽略查询字符串之后的所有内容，但JavaScript会加载该确切名称。

Another example is to make a copy of common.js and renamed it to commonClone.js which is then used for the iframe page. 另一个例子是制作common.js的副本并将其重命名为commonClone.js ，然后将其用于iframe页面。

Either example might allow you to set the break-point twice in IE9, one for each asset. 这两个示例都可能允许您在IE9中设置两次断点，每个资产一次。

That said, there's nothing stopping you from creating iframe only breakpoints that are independent of common.js file that the parent page is using.. This method, let's call it parallel break-point , allows for asynchronous debugging of JavaScript since the iframe page and the parent page are processing JavaScript independently yet may be working in tandem. 也就是说，没有什么能阻止你创建iframe只有断页 ，这些断点独立于父页面正在使用的common.js文件。这个方法，我们称之为并行断点 ，允许从iframe页面开始对JavaScript进行异步调试。 父页面正在独立处理JavaScript，但可能正在协同工作。

Reference for this method is from official source MSDN Library: Using the F12 Developer Tools to Debug JavaScript Errors section Managing Breakpoints that shows how to perform breakpoints on multiple JavaScript files. 此方法的参考来自官方源 MSDN Library： 使用F12开发人员工具调试JavaScript错误部分管理断点 ，显示如何在多个JavaScript文件上执行断点。

According to a recent forum post at the IE9 Developers Forum, the solution to prevent reloading of JavaScript files when used for debugging is to use the inline event handler instead of attachEvent as shown in this example: 根据IE9开发者论坛最近的一篇论坛帖子，防止在用于调试时重新加载JavaScript文件的解决方案是使用内联事件处理程序而不是attachEvent ，如下例所示：

replace (or comment it out)

$(document).onload(function(){ mycustomonload functions});

with

<body onload="mycustomonload functions">

Answer 3

If you are doing this solely for compatibility testing then have you tried using IETab plugin for Chrome? 如果您仅为兼容性测试而这样做，那么您是否尝试过使用IETab插件进行Chrome？

This emulates IE's rendering engine while allowing you to use the Chrome debugger. 这可以模拟IE的渲染引擎，同时允许您使用Chrome调试器。

If this isn't good enough then I think you've hit an impasse, IE dev tools just aren't sophisticated enough. 如果这还不够好，那么我认为你已经陷入僵局，IE开发工具就不够复杂了。

Answer 4

Perhaps, if you could restructure your Html and JavaScript code, you could only reference common.js from the parent page and make both the main and the nested page use the same JavaScript function. 也许，如果你可以重构你的Html和JavaScript代码，你只能从父页面引用common.js ，并使主页面和嵌套页面都使用相同的JavaScript函数。

That way one break point would satisfy both scenarios. 这样一个断点就可以满足两种情况。

Answer 5

To debug iframes in IE, and be able to set and retain breakpoints, you could open the iframe address in its own ie tab/window. 要在IE中调试iframe，并能够设置和保留断点，您可以在自己的选项卡/窗口中打开iframe地址。 This is not possible/straightforward however if the iframe communicates with its parent. 但是，如果iframe与其父级进行通信，则这是不可能/直接的。

Answer 6

I hope you at least are using IE Debuggy Bar. 我希望你至少使用IE Debuggy Bar。 Update your common.js file with this code 使用此代码更新您的common.js文件

function func () {
    if(typeof window.parent.debug !== "undefined"){
        window.parent.debug();
    }
    document.getElementsByTagName( 'h1')[0].style.color = 'red';
}


function debug(){
    var a = "break here";
}

set break point to var a = "break here"; 将断点设为var a = "break here"; after your main page loads. 主页加载后 When you hit Load Iframe button js will stop on that line. 当您点击Load Iframe按钮时，js将在该行停止。 Use call stack to navigate to previous javascript instruction (line) which should be in common.js file in nestedpage.html. 使用调用堆栈导航到以前的javascript指令（行），该指令应位于nestedpage.html中的common.js文件中。 Now set another break point where ever you'd like and hit continue in debugger, or use STEP feature 现在设置另一个断点，无论你想要什么，并在调试器中点击继续，或使用STEP功能

== UPDATE === ==更新===

BTW, to answer your question, why break point cannot be persisted in iframe, think this way. 顺便说一句，回答你的问题，为什么断点不能坚持在iframe中，这样想。 Each time you click on "Load IFrame" button, old instance of window object is disposed in memory and with it all break points and new is created with new common.js instance. 每次单击“加载IFrame”按钮时， window对象的旧实例将被放置在内存中，并使用新的common.js实例创建所有断点和new。 Same would happen if you would call windows.open("http://......"); 如果你要调用windows.open("http://......");也会发生同样的情况windows.open("http://......");

Also keep in mind even you have same file loaded in both window(s) , it is loaded in two different execution frames in browser. 另外请记住，即使您在两个window(s)加载了相同的文件，它也会在浏览器中加载两个不同的执行框架。 you can run two browser instances of same browser but they are not showing same page in window. 您可以运行两个相同浏览器的浏览器实例，但它们不会在窗口中显示相同的页面。 Tho, there are things which are shared, like cookies but that is out of scope of this topic. Tho，有些东西是共享的，比如cookie，但这超出了本主题的范围。

Answer 7

您可以使用setTimeout（）暂停javascript进行特定时间...

如何在Internet Explorer中暂停JavaScript执行？

问题描述

How to do it on the main page: 如何在主页面上执行此操作：

How to do it on the nested page: 如何在嵌套页面上执行此操作：

7 个解决方案

解决方案1
4 已采纳 2012-05-25 11:53:33

解决方案2
3 2012-05-25 03:43:29

解决方案3
1 2012-05-20 13:45:10

解决方案4
1 2012-05-24 07:39:37

解决方案5
1 2012-05-24 12:42:59

解决方案6
1 2012-05-27 04:40:35

解决方案7
0 2012-05-26 12:48:38

如何在Internet Explorer中暂停JavaScript执行？

问题描述

How to do it on the main page: 如何在主页面上执行此操作：

How to do it on the nested page: 如何在嵌套页面上执行此操作：

7 个解决方案

解决方案1 4 已采纳 2012-05-25 11:53:33

解决方案2 3 2012-05-25 03:43:29

解决方案3 1 2012-05-20 13:45:10

解决方案4 1 2012-05-24 07:39:37

解决方案5 1 2012-05-24 12:42:59

解决方案6 1 2012-05-27 04:40:35

解决方案7 0 2012-05-26 12:48:38

解决方案1
4 已采纳 2012-05-25 11:53:33

解决方案2
3 2012-05-25 03:43:29

解决方案3
1 2012-05-20 13:45:10

解决方案4
1 2012-05-24 07:39:37

解决方案5
1 2012-05-24 12:42:59

解决方案6
1 2012-05-27 04:40:35

解决方案7
0 2012-05-26 12:48:38