Question

最终目标是在按钮被剪裁并且“顶部”小于0时让div“animate”向下。我想使用一个按钮（对于样式）但是当我这样做时，它似乎发帖。这是我的按钮：

<button id="expcoll" class="expcoll" onclick="expcoll();" runat="server">↓</button>

这是我的javascript：

function expcoll() {
    var dFilter = document.getElementById("dFilter");
    var expcoll = document.getElementById("MainContent_expcoll");
    if (dFilter.offsetTop == 0) {
        $("#dFilter").css({ 'top': -200 });
        expcoll.innerHTML = "↓";
    }
    else {
        $("#dFilter").css({ 'top': 0 });
        expcoll.innerHTML = "↑";
    }
}

任何人都可以建议一种更好的方式或方法，使其无法发布按钮的位置吗？如果你对我为什么要使用按钮感到好奇，我尝试使用mouseenter和mouseleave，但是因为一些文本框打开了jQuery日历，每当我这样做时，div就会崩溃（但是日历仍然存在）。然后我在div上执行了“单击”功能，但是如果我单击文本框，它将关闭（但日历保持不变）。如果您需要更多信息，请告诉我。非常感谢你。

Answer 1

客户端点击事件需要返回false才能中止回发。尝试添加以下内容：

<button id="expcoll" class="expcoll" onclick="expcoll();return false;" runat="server">↓</button>

如果可以，您应该使用ASP.NET按钮控件：

<asp:Button ID="Button1" runat="server" OnClientClick="expcoll();return false;" ...>

修改

如果你在函数结束时返回false，可能会更整洁（感谢@Jon Hanna）：

function expcoll() { var dFilter = document.getElementById("dFilter"); var expcoll = document.getElementById("MainContent_expcoll"); if (dFilter.offsetTop == 0) { $("#dFilter").css({ 'top': -200 }); expcoll.innerHTML = "↓"; } else { $("#dFilter").css({ 'top': 0 }); expcoll.innerHTML = "↑"; } return false; } <button id="expcoll" class="expcoll" onclick="return expcoll();" runat="server">↓</button>

Answer 2

如果您需要客户端按钮，请不要设置runat="server"。

顺便给一个函数提供相同的名称和一个元素ID不是一个好主意 - javascript引擎可能不会发现你试图调用该函数而是尝试调用该元素...

Answer 3

我对这个答案并不完全确定，但值得一试。我想你可以在你的javascript onClick（）方法的末尾放一个return false;，它会阻止回发。

编辑：您也可以尝试onClientClick（）事件

Answer 4

如果您希望能够拨打expcoll()，则需要从OnClientClick拨打电话，因为这是客户端点击事件。换句话说，您的标记应如下所示：

<asp:button id="expcoll" Text="↓" class="expcoll" onClientclick="expcoll();" OnClick ="EventHandlerForClickOnServerSide" runat="server"></asp:button>

修改

仔细阅读，似乎你不想要服务器控件。这样做：

<input id="expcoll" class="expcoll" type="button" onclick="expcoll();">↓</input>

按钮不发布

4 个答案: