按钮的 OnClientClick 和 Click 事件未触发 - FireFox 中的问题

Question

我将 Onclientclick 事件附加到服务器端代码中的按钮，如下所示，

TopPanelButton.OnClientClick = string.Format("if(!ValidData({0},{1},{2},{3})) return false;", txtOD.ClientID, radCmbOD.ClientID, txtgetMe.ClientID, RadAjaxLoadingPanel1.ClientID);

此外，onClick 事件附加到 aspx 页面中的同一按钮，

 <asp:Button ID="TopPanelButton" runat="server" Text="Go" 
   CssClass="CBtn1" Width="30px" Height="21px" OnClick="TopPanelButton_Click" />

如果 onclientclick 返回 true，则应触发服务器端单击事件。调用“ValidateData()”函数来验证表单中的条目。

这段代码在 IE 中运行良好。但在 Firefox 中，这两个事件都不会触发。如果我评论“TopPanelButton.OnClientClick =...”代码，则 onClick 事件将触发。

---

我可以在下面的代码中的哪里应用此代码 Page.ClientScript.GetPostBackEventReference() 。

TopPanelButton.OnClientClick = string.Format("if(!ValidData({0},{1},{2},{3})) return false;", txtOD.ClientID, radCmbOD.ClientID, txtgetMe.ClientID, RadAjaxLoadingPanel1.ClientID);

Firefox 没有调用 ValidData 函数。我将警报放入 JavaScript 中，但警报消息未在 Firefox 中显示。但 IE 显示警报消息。

我的 validData 函数：

function ValidData(txtOND, ddlOND, txtgetMe, aPanel) {
        alert("Entered");
        if (!ValidNumber(txtgetMe)) {
            aPanel.hide();
            return false;
        }

        if (ddlOND.value == "Origin" || ddlOND.value == "Destination") {
            if (!ValidOriginOrDestination(txtOND, ddlOND.value)) {
                aPanel.hide();
                return false;
            }
        }
        else if (ddlOND.value == "O&D") {
            if (!ValidOND(txtOND)) {
                aPanel.hide();
                return false;
            }
        }

        if (ddlOND.value == "Region Starting with" || ddlOND.value == "Country Starting with" || ddlOND.value == "Budget Station Starting with") {
            if (txtOND.value.length == 0) {
                radalert("Enter  a value for " + ddlOND.value);
                aPanel.hide();
                return;
            }
        }
        aPanel.show();
        return true;
    }

Answer 1

我发现了问题并解决了。下面给出了我的问题的解决方案。

我正在使用 telerik 控件，其中 clientID 不被视为 Firefox 中的对象。但IE将clientID视为对象。所以我之前的代码在 IE 中运行良好，而不是在 Firefox 中运行良好。现在我更改了 OnClientClick，通过将 clientID 作为字符串传递，如下所示，在单引号中：

TopPanelButton.OnClientClick = string.Format("javascript:if(!ValidData('{0}','{1}','{2}','{3}')) return false;", txtOD.ClientID, radCmbOD.ClientID, txtgetMe.ClientID, RadAjaxLoadingPanel1.ClientID);

在我的 javascript 中，我使用 document.getElementById 来获取对象。

function ValidData(txtOND, ddlOND, txtgetMe, aPanel) {
        var l_aPanel = document.getElementById(aPanel);
        var l_txtgetMe = document.getElementById(txtgetMe);

        if (!ValidNumber(l_txtgetMe)) {
            return false;
        }

        var l_txtOND = document.getElementById(txtOND);
        var l_ddlOND = document.getElementById(ddlOND);

        if (l_ddlOND.value == "Origin" || l_ddlOND.value == "Destination") {
            if (!ValidOriginOrDestination(l_txtOND, l_ddlOND.value)) {
                return false;
            }
        }
        else if (l_ddlOND.value == "O&D") {
            if (!ValidOND(document.getElementById(txtOND))) {
                return false;
            }
        }

        if (l_ddlOND.value == "Region Starting with" || l_ddlOND.value == "Country Starting with" || l_ddlOND.value == "Budget Station Starting with") {
            if (l_txtOND.value.length == 0) {
                radalert("Enter  a value for " + l_ddlOND.value);
                return false;
            }
        }
        return true;
    }

这在 IE 和 Firefox 中都可以正常工作。

Answer 2

FireFox 不处理 OnClientClick 和 OnClick 事件（尽管 Internet Explorer 处理得很好）。为了解决这个问题，可以使用一个方法 Page.ClientScript.GetPostBackEventReference() 来生成客户端 Javascript 以进行控件的回发。

因此，以下代码将隐藏页面上除加载图形之外的所有内容，并调用 btnSubmit 回发方法。
它返回 false 的原因是，否则 Internet Explorer 将调用服务器端 OnClick 方法两次。

btnSubmit.OnClientClick = String.Format("ElementStyle(document.getElementById('wrapper'),'display','none'); {0}; return false;", Page.ClientScript.GetPostBackEventReference(btnSubmit, ""));