Question

有人知道如何从客户端关闭Ballon Popup Extender吗？一切都很好但是因为我设置了BPE来显示鼠标悬停，所以我尝试在鼠标输出时没有任何关闭或隐藏方法是非常不合理的：

  function hideElement() {
        document.getElementById(ID).style.display = 'none';
    }

function hideControl() {
    document.getElementById('<%=ID.ClientID%>').style.visibility = "hidden";
    return false;
}

我将上面的方法连接到一个div onmouseout，我可以隐藏页面上的任何控件而不是BPE，我试图对BPE所针对的面板执行相同的操作但没有发生任何事情..

我错过了什么或BPE就是这样吗？

Answer 1

这实际上并不太难。您可以在页面上创建这样的方法：

<script type="text/javascript">
    function hidePopup() {
        var popupObject = document.getElementById("<%= Panel1.ClientID %>");
        popupObject.BalloonPopupControlBehavior.hidePopup();
    }
</script>

然后从控件的onmouseout事件中调用该函数，该事件是BalloonPopupExtender的TargetControlID（在我的示例Panel1中）。这是我用来测试javascript的代码：

<asp:Panel ID="Panel1" runat="server" BackColor="#009900" Height="50px" 
    Width="50px" onmouseout="hidePopup();">
</asp:Panel>
<asp:BalloonPopupExtender ID="Panel1_BalloonPopupExtender" runat="server" 
    CustomCssUrl="" DisplayOnClick="False" DisplayOnMouseOver="True" 
    DynamicServicePath="" Enabled="True" ExtenderControlID="" 
    TargetControlID="Panel1" BalloonPopupControlID="junk">
</asp:BalloonPopupExtender>

<div id="junk">
    Hey!  Here's some stuff!
</div>

Answer 2

正是我在寻找的东西。但是，而不是所有额外的JavaScript，只需将onmouseout="BalloonPopupControlBehavior.hidePopup();"放在控件中。

Answer 3

我对jadarnel27的回答做了一些改进，因为我有多个控件，每个控件都有自己的气球扩展器。

<asp:Image runat="server" ID="imgHelp1" ImageUrl="images/help_16x16.png" />
<ajaxToolkit:BalloonPopupExtender ID="imgHelp1_BalloonPopupExtender" runat="server"
    CustomCssUrl="" DisplayOnClick="False" DisplayOnMouseOver="True" 
    DynamicServicePath="" Enabled="True" ExtenderControlID="" 
    TargetControlID="imgHelp1" BalloonPopupControlID="help1" />
<div id="help1">Help text goes here</div>

然后在

背后的代码中

if (!Page.IsPostBack) {
imgHelp1.Attributes.Add("onmouseout", "document.getElementById(\"" + imgHelp1.ClientID + "\").BalloonPopupControlBehavior.hidePopup();");
}

通过这种方式，我们完全无需使用javascript函数，并允许在同一页面上进行更多控制。

鼠标移开时关闭AJAX Control Toolkit BallonPopupExtender

3 个答案: