从asp.net调用javascript函数复选框

我有一个jQuery函数，如下所示，我希望在复选框点击时调用它。 当我使用input type="checkbox"它工作正常。 但我想检查/取消选中c＃代码（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' }); } } 

请帮忙

Answer 1

这是因为asp.net会向id添加更多东西，比如ctl， ctl00_ContentPlaceHolder1_chkVehicle等…类似于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' }); } } 

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

或使用jquery属性ends-with选择器，虽然因为它进行了通配符匹配，但结果可能会变得很危险。

  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更好地设置这些属性

Answer 2

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

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

Answer 3

原因可能是jQuery的Id选择器＃ 。
如果您使用Master Page或User_controls ，Id将获得asp.net的更改。
您可以对控件使用静态clientId模式，这不会更改控件的ID

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