•  06-09-2019
  •  | 
  •  

Frage

Ich habe den folgenden Code bekommen: 

<span style="margin:0px 2px 0px 2px;">
    <asp:Label ID="labelPromptText" runat="server" Text="Selected Location:" />
    <span id="spanSelectedLocation" style="padding:2px 2px 2px 2px; cursor:pointer;" onmouseover="javascript:SetBackgroundColor('spanSelectedLocation', '#E0E0E0');" onmouseout="javascript:SetBackgroundColor('spanSelectedLocation', '#FFFFFF');" onclick="ControlLocationsVisibility();">
        <asp:Label ID="labelDisplay" runat="server" Text="None" Font-Bold="True" />
        <img alt="Click to change" src="Images/downArrow.png" />
    </span>
</span>

<asp:Panel ID="panelLocations" runat="server" DefaultButton="buttonFindLocation" style="position:absolute;border:solid 1px #E0E0E0;padding:10px 5px 5px 10px;background-color:#F7F7F7;width:350px;display:none;" >
    Search: <asp:TextBox ID="textboxLocationSearch" runat="server" />

    <asp:Button ID="buttonFindLocation" runat="server" Text="Find" OnClick="buttonFindLocation_Click" />

    <input type="button" value="Cancel" onclick="javascript:ControlLocationsVisibility();"

    <hr />

    <asp:TreeView ID="TreeViewLocations" runat="server" OnSelectedNodeChanged="TreeViewLocations_SelectedNodeChanged" NodeIndent="10"></asp:TreeView>
</asp:Panel>

Ich möchte in der Lage sein, die panelLocations zu verstecken, wenn jemand aus der Platte einrastet. Ich habe versucht, ein onblur Ereignis der panelLocations setzen, aber es verschwindet immer, wenn das TreeView geklickt wird.

Wie kann ich mich verstecken die Platte, wenn jemand außerhalb davon anklickt, aber nicht innerhalb der IT?

War es hilfreich?

Lösung

Wenn Sie verwenden setTimeout () und clear () können Sie den blurevent verwenden können, wie Sie erwähnt haben, aber das Timeout löschen, wenn etwas im Panel Fokus erhält. Auf diese Weise, die einzige Zeit, würde ausführen würde das Ereignis sein, wenn es „wirklich“ verloren Fokus.

Andere Tipps

Ihre andere Alternative ist Onclick Ereignisse auf dem Körper zu behandeln, aber das ziemlich schnell langsam bekommen konnte. Wenn Sie diesen Weg zu gehen, würde es so aussehen wie diese: 

<html>
 <head>
  <title>Hide Test</title>
 </head>
 <body>
  <div id="first">
    <p>This is the first div.</p>
  </div>
  <div id="second">
    <p>This is the second div.</p>
  </div>
  <script type="text/javascript">
  var first = document.getElementById("first");
  var second = document.getElementById("second");
  var isChildOf = function (ele, parent) {
    if (ele.parentNode === null) {
        return false;
    } else if (ele.parentNode === parent) {
        return true;
    } else {
        return isChildOf(ele.parentNode, parent);
    }
  };
  document.body.onclick = function(e) {
    if (isChildOf(e.target, second)) {
        console.log("Hiding second.");
        second.style.display = 'none';
    } else {
        console.log("Showing second.");
        second.style.display = 'block';
    }
  };
  </script>
 </body>
</html>
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top