Question

当使用jquery检查复选框时，我正试图使用2个不同的掩码屏蔽文本框。

我用html文本框和html复选框尝试了我的代码，它工作正常但是当我尝试使用asp文本框和asp复选框的代码时没有响应。

任何建议???

这是我的代码：

 <%@ Page Title="" Language="C#" MasterPageFile="~/Imam.Master" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="Imam_Contacts.WebForm4" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">

<script src="js/jquery-1.4.1.js" type="text/javascript"></script>


    <script src="js/jquery.maskedinput-1.2.2.js" type="text/javascript"></script>
      <script type="text/javascript">

          $(document).ready(

function() {

    $('#chkhtml').click(

 function() {
     if ($('#chkhtml:checked').length > 0) {
         $("#txthtml").mask("999-99-9999");
     } else {
         $("#txthtml").mask("99/99/9999");
     }
 });

});

$(document).ready(

function() {

    $('#chkasp').click(

 function() {
     if ($('#chkasp:checked').length > 0) {
         $("#txtasp").mask("999-99-9999");
     } else {
         $("#txtasp").mask("99/99/9999");
     }
 });

});
    </script>


</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <asp:CheckBox ID="chkasp" runat="server" />
    asp:<asp:TextBox ID="txtasp" runat="server"></asp:TextBox>
    <input id="chkhtml" type="checkbox" checked="checked" title="chkhtml"  />HTML <input id="txthtml" type="text" />&nbsp; 

</asp:Content>

Answer 1

当您的控件位于另一个INamingContainer中时，他们的ID会比其长（在您的情况下至少Content2$chkasp而非chkasp，可能更长），请使用.ClientID来解决此问题，例如这样：

$(function() {
    $('#<%=chkasp.ClientID %>').click(function() {
     if ($(this).is(':checked')) {
         $("#<%=txtasp.ClientID %>").mask("999-99-9999");
     } else {
         $("#<%=txtasp.ClientID %>").mask("99/99/9999");
     }
});

或使用条件表达式缩短它：

$('#<%=chkasp.ClientID %>').click(function() {
  $("#<%=txtasp.ClientID %>").mask($(this).is(':checked') ? 
                                   "999-99-9999" : "99/99/9999");
});

使用jquery的asp文本框的掩码

1 个答案: