我创建了一个HTML应用程序，用于在目录中搜索用户定义的搜索词并将结果返回到列表中。作为该工具的一部分，我使用户可以直接在应用程序的iframe中打开生成的文件夹。
现在最棘手的部分是在iframe的命令状态更改时启用/禁用前进和后退导航按钮。
我某种程度上无法将其添加到我的iframe元素中！像BeforeNavigate2这样的其他事件也可以正常工作...
我的代码段：
<script>
var EmbededExplorer;
var EmbededExplorerObj;
var FSO = new ActiveXObject("Scripting.FileSystemObject");
function Body_OnLoad()
{
InitEmbededExplorer();
}
function InitEmbededExplorer()
{
var ExplorerDiv = document.getElementById("MyIFrameDiv");
EmbededExplorer = document.createElement("IFRAME");
EmbededExplorer.setAttribute("type", "text/html");
EmbededExplorer.setAttribute("style", "float:left;width:90%;height:100%;border:0px");
ExplorerDiv.insertBefore(EmbededExplorer, ExplorerDiv.children(2));
EmbededExplorer.setAttribute("src", "C:\");
EmbededExplorerNavigateTo("C:\SomeDirectory\HighlightedFile.txt");
}
function EmbededExplorerNavigateTo(Destination)
{
var E = null;
var Path;
Path = FSO.GetParentFolderName(Destination);
if (FSO.FolderExists(Destination))
{
Path = Destination;
}
else if (FSO.FileExists(Destination))
{
Path = FSO.GetParentFolderName(Destination);
}
else
{
alert("Unable to locate the file or directory.");
}
try
{
EmbededExplorer.setAttribute("src", Path);
}
catch (Excep)
{
E = Excep;
}
if (E != null)
{
alert("Could not open directory. Please refer to the administrator.");
}
else
{
//UpdateFolderAddressBar(document.getElementById('MyIFrameAddressBar'), Path);
setTimeout(function() { RegisterEmbededBrowserAfterLoading(Destination); }, 100);
}
}
function RegisterEmbededBrowserAfterLoading(SelectItem)
{
if (EmbededExplorer.contentWindow.document.readyState == "loading")
{
setTimeout(function() { RegisterEmbededBrowserAfterLoading(SelectItem); }, 100);
}
else
{
//EmbededExplorer.contentWindow.document.childNodes[0] contains the actual (shell-)explorer-component of the iframe (a WebBrowser2 class component)
EmbededExplorer.contentWindow.document.childNodes[0].RegisterAsBrowser = true;
EmbededExplorerObj = EmbededExplorer.contentWindow.document.childNodes[0];
//All my attempts to add the CommandStateChange-Event
EmbededExplorer.attachEvent("CommandStateChange", EmbededExplorerObj_CommandStateChange);
EmbededExplorerObj.attachEvent("CommandStateChange", EmbededExplorerObj_CommandStateChange);
EmbededExplorer.CommandStateChange = function(a, b) {alert("CommandStateChange fired!!");};
EmbededExplorerObj.CommandStateChange = function(a, b) {alert("CommandStateChange fired!!");};
//The following event works fine...
EmbededExplorerObj.attachEvent("BeforeNavigate2", EmbededExplorerObj_BeforeNavigate2);
if (SelectItem)
{
EmbededExplorerObj.Document.SelectItem(SelectItem.replace(/\//g, "\\"), 16 + 8 + 1);
}
}
}
function EmbededExplorerObj_CommandStateChange(Command, Enable)
{
alert("CommandStateChange fired!!");
//Code to enable / disable my forward / backward navigation buttons
}
function EmbededExplorerObj_BeforeNavigate2(Obj, URL)
{
alert("BeforeNavigate2 fired!!");
//UpdateFolderAddressBar(document.getElementById('MyIFrameAddressBar'), URL);
}
</script>
出于验证目的，我在VBA中重建了事件，并且效果很好。
Private WithEvents Win As WebBrowser
Sub SetWin()
Dim WinShell 'As New Shell32.Shell
Set WinShell = CreateObject("Shell.Application")
Set Win = WinShell.Windows(1)
End Sub
Private Sub Win_CommandStateChange(ByVal Command As Long, ByVal Enable As Boolean)
Stop 'fires 3x after every navigation, each time containing my desired state-information in the 'Command' parameter
End Sub
编辑： 根据要求，我将在下面添加应用程序的结构：
<BODY Onload="Initialisieren()" OnContextMenu="return false;" OnClick="VerbergeContextMenus()" OnKeyPress="Body_OnKeyPress()" OnFocus="document.getElementById('ModNr').focus()" OnBeforeUnload="TempLeeren();">
<TABLE Style="Width: 100%; Height: 100vh" border="0">
<TR Style="Height:auto">
<TD Style="Width: 50%; Vertical-Align: text-top">
<LABEL For="ModNr" Class="Überschrift" OnSelectStart="return false;">Suchbegriff:</LABEL><INPUT ID="ModNr" Type="Text" UseContextMenuId="CopyPasteContextMenu" onContextMenu="ZeigeContextMenu(this, event);return false;">
</TD>
<TD Style="Width: 50%; Vertical-Align: text-top">
<DIV Class="Überschrift" OnSelectStart="return false;">Zuletzt geöffnet:</DIV>
</TD>
</TR>
<TR Style="Height:auto">
<TD>
<DIV Class="Bereich" ID="Auswahl" OnSelectStart="return false;">
<TABLE Style="Width: 100%" ID="AuswahlTabelle">
<TR></TR>
<TR Style="Height: 30px">
<TD ColSpan="99" Style="Vertical-Align: Bottom"><INPUT ID="SuchKnopf" Type="Button" Value="Suche"></TD>
</TR>
</TABLE>
</DIV>
<DIV Class="Bereich" ID="DatenBankAuswahl" OnSelectStart="return false;">
<TABLE Style="Width: 100%; Margin: 0px; Padding: 0px" ID="DatenBankAuswahlTabelle">
<TR></TR>
</TABLE>
</DIV>
</TD>
<TD Style="Vertical-Align: Top" rowSpan="99">
<DIV Class="ListenBereich" Name="Historie" ID="Historie" Type="Radio" size="20" OnSelectStart="return false;">
</DIV>
</TD>
</TR>
<TR Style="Height:auto">
<TD>
<DIV Class="Überschrift" OnSelectStart="return false;" Id="Überschrift">Suchergebnisse:</DIV>
</TD>
</TR>
<TR>
<TD>
<DIV Class="ListenBereich" Name="Ergebnisse" ID="Ergebnisse" OnSelectStart="return false;">
</DIV>
<DIV Class="Bereich" Name="MyIFrameDiv" ID="MyIFrameDiv" style="display:none">
<BUTTON ID="ExplorerCloseBtn" Title="Schließen" Style="float:right;min-width:1px;width:5%;height:100%;border-radius:0px 8px 8px 0px;margin:0px;padding:0px" OnClick="SuchergebnisseAnzeigen();"><div style="position:relative;font-family:'wingdings 2';font-Size:20px">T</DIV></BUTTON>
<DIV Style="float:left;min-width:1px;width:5%;height:100%;margin:0px;padding:0px">
<BUTTON disabled="true" ID="ExplorerNavigateRootBtn" Title="Zum übergeordneten Verzeichnis" Style="float:left;min-width:1px;width:100%;height:33%;border-radius:8px 0px 0px 0px;margin:0px;padding:0px" OnClick="ExplorerNavToRoot();"><div style="position:relative;font-family:'wingdings 3';font-Size:20px">Í</DIV></BUTTON>
<BUTTON disabled="false" ID="ExplorerNavigateGoBack" Title="Einen Schritt zurück" Style="float:left;min-width:1px;width:100%;height:34%;border-radius:0px 0px 0px 0px;margin:0px;padding:0px" OnClick="try{ EmbededExplorerObj.goBack(); } catch(Excep) { }"><div style="position:relative;font-family:'wingdings 3';font-Size:20px">§</DIV></BUTTON>
<BUTTON disabled="false" ID="ExplorerNavigateGoForward" Title="Einen Schritt vor" Style="float:left;min-width:1px;width:100%;height:33%;border-radius:0px 0px 0px 8px;margin:0px;padding:0px" OnClick="try{ EmbededExplorerObj.goForward(); } catch(Excep) { }"><div style="position:relative;font-family:'wingdings 3';font-Size:20px">¨</DIV></BUTTON>
</DIV>
</DIV>
</TD>
</TR>
</TABLE>
</BODY>