0

我有一个 jQuery 函数，如下所示，我希望在单击复选框时调用它。当我使用它时，input type="checkbox"它工作正常。但我想选中/取消选中 c# code(fillform()) 中的复选框，并基于此 JavaScript 函数也必须执行

但是，如果我设置runat="server"或使用asp:checkbox，则不会调用以下函数。我尝试将以下代码用于 asp:checkbox 以及 page_load 中的输入框，但未调用该函数

C# 代码

Page_load
  {
    chkVehicle.Attributes.Add("onclick", "toggleVehicle();");

  } 
  FillForm
  {
    chkVehicle.Checked = ObjUR.HasVehicle;


  }

jQuery函数

 function toggleVehicle() {
        if ($('#chkVehicle').is(':checked')) {
            $('#divVehicle :input').removeAttr('disabled');
            $('#divVehicle').css({ "background-color": 'transparent' });
        } else {
            $('#divVehicle :input').attr('disabled', true);
            $('#divVehicle').css({ "background-color": 'gray' });
        }
    }
4

3 回答 3

4

那是因为 asp.net 在 id 上附加了一些更多的东西，比如 ctl、contentplaceholder 等等……比如ctl00_ContentPlaceHolder1_chkVehicle. 相反，您可以这样做：

 function toggleVehicle() {
         var chkVehicle  = '#<%= chkVehicle.ClientID %>';
        if ($(chkVehicle).is(':checked')) {
            $('#divVehicle :input').prop('disabled', false);
            $('#divVehicle').css({ "background-color": 'transparent' });
        } else {
            $('#divVehicle :input').prop('disabled', true);
            $('#divVehicle').css({ "background-color": 'gray' });
        }
    }

或者只是分配一个类名并使用类名选择它。

或使用 jquery 属性以选择器结尾，但这可能会带来风险，因为它会进行通配符匹配，而且速度也较慢。

      if ($('[id$="chkVehicle"]').is(':checked')) {
       ....

或如@jsonscript 建议的那样

chkVehicle.Attributes.Add("onclick", "toggleVehicle('#" + chkVehicle.ClientId + "');");

和

 function toggleVehicle(chkVehicle) {

        if ($(chkVehicle).is(':checked')) {
            $('#divVehicle :input').prop('disabled', false);
            $('#divVehicle').css({ "background-color": 'transparent' });
        } else {
            $('#divVehicle :input').prop('disabled', true);
            $('#divVehicle').css({ "background-color": 'gray' });
        }
    }

也不要使用onclick属性，而是将处理程序绑定到元素。

  $(function(){ //DOM ready
       $('#<%= chkVehicle.ClientID %>').change(toggleVehicle);   

  });

   function toggleVehicle() {
         var $divVehicle = $('#divVehicle');
        if (this.checked) {
            $divVehicle.css({ "background-color": 'transparent' });
        } else {
            $divVehicle.css({ "background-color": 'gray' });
        }
        $divVehicle.find(':input').prop('disabled', !this.checked);
   }

如果您不使用真正旧版本的 jquery，也可以使用 prop 而不是 attr。这将比 attr 更好地设置这些属性

于 2013-10-16T03:51:35.210 回答
1

在这段代码中： chkVehicle.Attributes.Add("onclick", "toggleVehicle();");chkVehicle 是复选框的 ID。

将复选框的 id 设置为“静态”，因为在呈现 .aspx 页面时，它会将 dom 的其他 id 附加到控件 id。Static 将阻止此更改，并且复选框的 id 将保持不变。

于 2013-10-16T04:22:34.913 回答
1

原因可能是 jQuery 的Id 选择器#。
如果您使用Master Page或，则 asp.net 的 ID 会发生变化User_controls。
您可以对控件使用静态 clientId 模式，这不会更改控件的 id

这是同一
http://www.codeproject.com/Articles/34151/ASP-NET-4-0-Client-ID-Feature的好文章

于 2013-10-16T04:35:30.763 回答