Question

我正在使用page_load事件中的以下代码在我的asp页面上动态生成复选框：

 protected void Page_Load(object sender, EventArgs e)
    {
        for (int i = 23; i < 30; i++)
        {
            CheckBox cb = new CheckBox();
            cb.ID = "chkd" + i.ToString();
            cb.Text = "WI " + i.ToString();
            cb.AutoPostBack = true;
            cb.CssClass = "myCheckBoxes";
            Panel1.Controls.Add(cb);
            Panel1.Controls.Add(new LiteralControl("<br>"));
        }
    }

我正在尝试使用JQuery根据单击的复选框的id执行存储过程。但是，单击的框的id始终为空字符串。我刚刚用JQuery弄湿了所以任何帮助都会受到赞赏。下面是我的JQuery代码：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $(".myCheckBoxes").click(function (event) {
            $.ajax({
                type: "POST",
                url: "idChecker.aspx",
                data: "id=" + $(this).val(),
                success: function (msg) {
                    if (msg != "None" && !$("#chkd" + msg).is(':checked')) {
                        $("#chkd" + msg).trigger('click');
                    }
                }
            });
        });
    });

</script>

Answer 1

data: "id=" + $(this).val()会为您提供复选框的值。如果您需要ID，请尝试

data: "id=" + $(this).attr('id')

Answer 2

获取你的id复选框试试这个

data: "id=" + $(this).prop("id"); // if you use jquery 1.6.2

或

data: "id=" + $(this).attr("id"); // if you use old version

<强>更新我尝试了您的脚本并注意到.Net为您的CheckBox生成的html为<span>，类名为myCheckBoxes，它包含两个控件，一个是您的复选框，另一个是{{1复选框文本。因此，您的javascript操作绑定到<label>，因为它具有在您的选择器中定义的类名，并且它没有id。

span

要获取您的复选框ID，您应修改选择器以获取范围内的复选框。您可以使用以下样本之一获取它

  <span class="myCheckBoxes">
    <input id="MainContent_chkd26" type="checkbox" name="ctl00$MainContent$chkd26">
    <label for="MainContent_chkd26">WI 26</label>
  </span>

Answer 3

将$（this）.val（）替换为$（this）.attr（'id'）

Answer 4

您可以稍微修改以进行调试：请注意$(this).attr("id");或$(this).prop("id");，具体取决于jQuery的版本。注意使用.prop（）如果可能的话，因为1.6.2 .attr（）只是调用它，如果它可以，你可以避免一个步骤。

我认为您可以使用网络服务或页面方法而不是返回整个页面（*但我不知道您的整个解决方案）（见下文）

   $(document).ready(function () {
      $(".myCheckBoxes").click(function (event) {
        var pString = '{"id":"' + $(this).prop("id") + '"}';
    //alert(pString);//uncomment to debug
        $.ajax({
          type: "POST",
          url: "idChecker.aspx/checkId",
          data: pString,
          success: function (msg) {
            if (msg != "None" && !$("#chkd" + msg).is(':checked')) {
              $("#chkd" + msg).trigger('click');
            }
          }
        });
      });
    });

假设： - 您没有直接要求的其他建议。您的服务器代码会查找“id”字符串。 PAGE方法中的示例：在页面的.cs文件中：

[WebMethod]
public static string checkId(string id)
{
    return id;
}

（务必将web.config设置放入以允许此操作）如果这不是你想要的方式，请忽略：）

<system.web>
   <httpModules>
     <add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
   </httpModules>
 </system.web>

最后的花絮，使用jQuery 1.6.2你可以修改（略微）ajax调用以解释asp.net返回数据的方式。更改这些部件并添加转换器：

dataType: "jsond",
type: "POST",
contentType: "application/json",
converters: {
  "json jsond": function(msg) {
    return msg.hasOwnProperty('d') ? msg.d : msg; 
 }
},

JQuery：如何检索C＃动态创建的复选框的id

4 个答案: