jQuery禁用输入无法正常工作

问题描述

我在页面上有一些输入元素，并试图根据一对单选按钮的设置启用它们或将其禁用。我使用了下面的Javascript函数（添加了控制台日志以查看发生了什么）...
$ b $ pre $ 函数EnableIndividualOrCompanyControls（个人）{
console.log（EnableIndividualOrCompanyControls（+ individual +））;
console.log（标题值是+ $（＃Title）。val（））;
console.log（Title was+ $（＃Title）。prop（disabled））;
$（＃Title）。prop（disabled，！individual）;
console.log（Title is now+ $（＃Title）。prop（disabled））;
console.log（）;
$（＃姓氏）。prop（disabled，！individual）;
$（＃CompanyName）。prop（disabled，individual）;
}


当单选按钮值改变时，方法被调用，参数具有正确的值，但Title，Surname和CompanyName输入从不禁用。

从控制台的示例看起来像这样...

pre $ Enable $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ / code>

所以，函数被调用，参数具有正确的值，我正确地获得Title输入元素可以看到它正确地报告它的值是Sir），但元素没有被禁用。

奇怪的是我正好使用相同的代码在页面上的其他地方，它工作正常。这个函数可以工作...
$ b $ pre $ 函数EnableOnlineControls（enable）{
$（＃UserName）。prop disabled，！enable）;
$（＃Password）。prop（disabled，！enable）;
$（＃PasswordAgain）。prop（disabled，！enable）;
}


任何人都知道为什么第一个不起作用？如果它有帮助，这里是这些表单元素的HTML（为了清楚起见删除了周边的div）...
$ b $

 < input class =form-controlid =Titlename =Titlevalue =/> 
< input class =form-controlid =Surnamename =Surnamevalue =/> 
< input class =form-controlid =CompanyNamename =CompanyNamevalue =/> 
  

我尝试用单引号替换双引号，但这没有任何区别。 p>

解决方案

解释了您的问题。

个人来自复选框;它是一个字符串。您必须正确地将其转换为布尔值：

  $（＃Surname）。prop（disabled，（individual ==false？false：true））; 
  

I have some input elements on a page, and am trying to enable them or disable them according to the setting of a pair of radio buttons. I'm using the following Javascript function (console logging added for me to see what's going on)...

function EnableIndividualOrCompanyControls(individual) {
  console.log("EnableIndividualOrCompanyControls(" + individual + ")");
  console.log("Title value is " + $("#Title").val());
  console.log("Title was " + $("#Title").prop("disabled"));
  $("#Title").prop("disabled", !individual);
  console.log("Title is now " + $("#Title").prop("disabled"));
  console.log(" ");
  $("#Surname").prop("disabled", !individual);
  $("#CompanyName").prop("disabled", individual);
}

When the radio button value is changed, the method is getting called, and the parameter has the correct value, however the Title, Surname and CompanyName inputs are never disabled.

As sample from the console looks like this...

EnableIndividualOrCompanyControls(false)
Title value is Sir
Title was false
Title is now false

So, the function is being called, the parameter has the correct value, I am getting the Title input element correctly (as you can see from the fact that it correctly reports that its value is "Sir"), but the elements are not being disabled.

The odd thing is that I use exactly the same code elsewhere on the page, and it works fine. This function works...

function EnableOnlineControls(enable) {
  $("#UserName").prop("disabled", !enable);
  $("#Password").prop("disabled", !enable);
  $("#PasswordAgain").prop("disabled", !enable);
}

Anyone any idea why the first one doesn't work? In case it helps, here is the HTML for those form elements (surrounding divs removed for clarity)...

<input class="form-control" id="Title" name="Title" value="" />
<input class="form-control" id="Surname" name="Surname" value="" />
<input class="form-control" id="CompanyName" name="CompanyName" value="" />

I tried replacing the double quotes with single ones, but that didn't make any difference.

解决方案

The answer to JQuery readOnly strange behavior explains your problem.

individual comes from a checkbox; it is a string. You have to cast it properly to a boolean:

$("#Surname").prop("disabled", (individual == "false" ? false : true));

这篇关于jQuery禁用输入无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！