0

在这里，我添加了 asp.net 代码和全局变量以及元素的 jquery 条件，这段代码对我来说很好，但我想简化这段代码。有人可以帮忙吗？

ASP.NET

    <div class="toggle_container">
            <p>
                <asp:HiddenField ID="hdnIsSwipe" runat="server" />
                <asp:Label ID="lblPaymentType" runat="server" Text="<span>*</span> Payment Type"
                    AssociatedControlID="ddlPaymentType"></asp:Label>
                <asp:DropDownList ID="ddlPaymentType" runat="server">
                </asp:DropDownList>
            </p>
            <p>
                <asp:Label ID="lblAccountNumber" runat="server" Text="<span>*</span> Account Number"
                    AssociatedControlID="txtAccountNumber"></asp:Label>
                <asp:TextBox ID="txtAccountNumber" runat="server" MaxLength="17" Style="width: 155px;"></asp:TextBox>
                <asp:HiddenField ID="hdnAccountNo" runat="server" />
                <asp:LinkButton ID="btnSwipe" runat="server" CausesValidation="false" OnClientClick="tb_show('Swipe','#TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=false');return false;"
                    Visible="true" Text="Swipe" CssClass="btnSwipe">

                </asp:LinkButton>
                <input id="btnClear" type="button" class="btnClear" name="Click and clear Account Data" />
            </p>
            <p>
                <asp:Label ID="lblAmount" runat="server" Text="<span>*</span> Amount" AssociatedControlID="txtAmount"></asp:Label><asp:TextBox
                    ID="txtAmount" runat="server" MaxLength="8"></asp:TextBox>
            </p>

            <p>
                <asp:Label ID="lblCVV2" runat="server" Text="CVV2" AssociatedControlID="txtCVV2"></asp:Label><asp:TextBox
                    ID="txtCVV2" runat="server" MaxLength="4"></asp:TextBox></p>
            <p>
                <asp:Label ID="lblReferenceNumber" runat="server" Text="Reference Number" AssociatedControlID="txtReferenceNumber"></asp:Label><asp:TextBox
                    ID="txtReferenceNumber" runat="server" MaxLength="50"></asp:TextBox></p>
            <p>
                <asp:Label ID="lblSaleTaxAmount" runat="server" Text="<span>*</span> Sale Tax Amount"
                    AssociatedControlID="txtSaleTaxAmont">
                </asp:Label><asp:TextBox ID="txtSaleTaxAmont" runat="server" MaxLength="10"></asp:TextBox></p>
            <p>
                <asp:Label ID="lblPoNumber" runat="server" Text="<span>*</span> PO Number" AssociatedControlID="txtPoNumber">
                </asp:Label><asp:TextBox ID="txtPoNumber" runat="server" MaxLength="20"></asp:TextBox></p>
            <p>
                <asp:Label ID="lblTaxType" runat="server" Text="<span>*</span> Tax Type" AssociatedControlID="ddlTaxType"></asp:Label>
                <asp:DropDownList ID="ddlTaxType" runat="server">
                </asp:DropDownList>
            </p>
        </div>

全局变量

    var lblSaleTaxAmount = '#<%=lblSaleTaxAmount.ClientID %>';
    var txtSaleTaxAmont= '#<%=txtSaleTaxAmont.ClientID %>';
    var lblPoNumber = '#<%=lblPoNumber.ClientID %>';
    var txtPoNumber= '#<%=txtPoNumber.ClientID %>';
    var lblTaxType = '#<%=lblTaxType.ClientID %>';
    var ddlTaxType ='#<%=ddlTaxType.ClientID %>';

jQuery代码

    $(ddlPaymentType).change(function(){
        if($(ddlPaymentType).val()=='1' || $(ddlPaymentType).val()=='-1'  )
        {
            $(lblSaleTaxAmount).hide();
            $(txtSaleTaxAmont).hide();
            $(lblPoNumber).hide();
            $(txtPoNumber).hide();
            $(lblTaxType).hide(); 
            $(ddlTaxType).hide(); 

            $("label[for='ContentSection_txtSaleTaxAmont']").hide(); 
            $("label[for='ContentSection_txtPoNumber']").hide();  
        }
        else
        {
            $(lblSaleTaxAmount).show();  
            $(txtSaleTaxAmont).show();
            $(lblPoNumber).show(); 
            $(txtPoNumber).show();
            $(lblTaxType).show(); 
            $(ddlTaxType).show();
        }
    });
4

2 回答 2

2

您可以hide()通过将所有选择器放在一起用逗号分隔来使用一个功能：

$(lblSaleTaxAmount, 
  txtSaleTaxAmont, 
  lblPoNumber, 
  txtPoNumber, 
  lblTaxType, 
  ddlTaxType)
.hide();

或者，如果您将它们放在父元素中，例如div#foo，您只需执行以下操作：

$('#foo').children().hide();
于 2012-06-27T05:30:32.293 回答
0

如果您需要一次隐藏标签和文本，您可以在其<div>周围添加标签并使用 div 的 id 一次隐藏标签和文本

编辑：新评论后的附加信息

您还可以向需要立即隐藏的控件添加一个类。就像示例添加一个带有 name 的类hidinggroup。然后在您的 CSS（假设您使用 CSS）中为用于隐藏的第二个类创建一个条目，例如.hideme { ... }

要隐藏项目，您可以执行以下操作

 $('.hidinggroup').addClass('hideme');

要取消隐藏它们，您可以这样做

 $('.hidinggroup').removeClass('hideme');

该类hideme必须包含用于以您想要的方式隐藏控件的标记......例如visibility: hidden;或display: none;

于 2012-06-27T05:31:48.317 回答