Question

我正在使用ASP.NET复选框控件。而我要做的就是简单地更改复选框更改事件上按钮的可见性。如果选中复选框则隐藏按钮，否则如果未选中则显示按钮。

我的jQuery代码有2个问题。

初始更改事件未触发。我已经在jQuery代码上提出了断点，并且没有调用函数。在第二次更改时，它会定期调用。
当按钮显示时，它只显示少于秒，然后返回隐藏状态，即使它显示在下次更改之前也可见。

这是我的ASP.NET代码：

<asp:UpdatePanel UpdateMode="Conditional" ID="upDirectDebitPanel" runat="server" EnableViewState="True">
    <ContentTemplate>
        <div runat="server" id="divSameAsMerchant" visible="False">
            <asp:CheckBox runat="server" ID="chkSameAsMerchantBank" AutoPostBack="True" Checked="True" OnCheckedChanged="chkSameAsMerchantBank_CheckedChanged" />
            <asp:Label runat="server" AssociatedControlID="chkSameAsMerchantBank" ID="lblSameAsMerchantBank" meta:resourcekey="lblSameAsMerchantBank"></asp:Label>
            <asp:Button runat="server" ID="btnShowBankInformationModal" meta:resourcekey="btnShowBankInformationModal" CausesValidation="False" style="visibility: hidden"/>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>

这是jQuery代码：

var sameAsMerchantBank = $('#<%=chkSameAsMerchantBank.ClientID%>');
var btnShowBankInformationModal = $('#<%=btnShowBankInformationModal.ClientID%>');

$(sameAsMerchantBank).change(function () {
     if ($(this).is(":checked")) {
           $(btnShowBankInformationModal).css("visibility", "hidden");
     }
     $(btnShowBankInformationModal).css("visibility", "visible");
});

这是该复选框的后端事件：

protected void chkSameAsMerchantBank_CheckedChanged(object sender, EventArgs e)
{
    if (chkSameAsMerchantBank.Checked)
    {
        SetShortAccountInfo(merchantIban.Value, merchantAccountNumber.Value,
                    merchantSwiftNumber.Value);
    }
    else
    {
        SetShortAccountInfo(directDebitIban.Value, directDebitAccountNumber.Value, directDebitSwiftNumber.Value);
    }
}

有人知道我做错了什么吗？

Answer 1

在您的代码中执行

//changes made here
//$(sameAsMerchantBank).change(function () {
$(document).on("change",sameAsMerchantBank,function () {
     if ($(this).is(":checked")) {
           $(btnShowBankInformationModal).css("visibility", "hidden");
     }
     //always goes here
     //$(btnShowBankInformationModal).css("visibility", "visible");
     //put else
     else{
       $(btnShowBankInformationModal).css("visibility", "visible");
     }
});

Answer 2

我之前遇到过这个问题。这是更新面板的常见问题。有两种方法可以解决。使用该复选框的触发器或使用以下代码：

function load() {
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(jsFunctions);
}
function jsFunctions() {            
        $("#btnClick").click(function () {                    
            alert("Alert: Hello from jQuery!");
    });
}

此代码。在jsfunctions函数中重新绑定您的事件。

无法显示/隐藏jQuery中的复选框检查按钮

2 个答案: