在其他文本输入字段中输入文本时启用复选框

Posted

技术标签:

【中文标题】在其他文本输入字段中输入文本时启用复选框【英文标题】:enable checkbox when entering text in other text input field 【发布时间】:2012-07-30 16:05:17 【问题描述】:

通常他们会做另一件事:在选中/取消选中复选框时启用/禁用文本输入字段,但只有当用户在文本字段(开始日期)中输入一些文本时,我才需要启用复选框组(工作日)。因此,当用户不在输入字段中输入开始日期时,复选框仍必须禁用。

我认为我需要比这里更进一步的行动:http://jsfiddle.net/H8VPY/11/

请帮我选择正确的 jquery 事件。

【问题讨论】:

【参考方案1】:

您可以使用prop() 方法和keyup 事件处理程序。请尝试以下操作:

$('input[name=other_name]').keyup(function()
    if (this.value.length > 0) 
       $('input[name="others"]').prop('disabled', false)
     else 
       $('input[name="others"]').prop('disabled', true)      
    
)

DEMO

或者正如 Esailija 正确建议的那样,您可以使用较短的版本:

$('input[name=other_name]').keyup(function()
     $('input[name="others"]').prop('disabled', !this.value.length)
)

【讨论】:

$('input[name="others"]').prop('disabled', !this.value.length ) 也可以 太棒了,谢谢 Raminson 和 Esailija,您的回答解决了问题。现在,当用户尝试选中复选框并且由于它被禁用而无法执行此操作时,我想用红色(添加一些 css 类)为这个文本输入着色。或者只是在复选框附近提示一些消息。或者我不能这样做,因为复选框被禁用并且所有事件都无法使用它? 再次感谢您,Raminson。我将css添加到,它会很酷! 【参考方案2】:

添加一个类并禁用您的复选框;

<checkbox class="checkbox_class" disabled >

在您的文本框上;

<input type="text" onkeyup="javascript: if($(this).val() != '') $('.checkbox_class').enable()" >

【讨论】:

以上是关于在其他文本输入字段中输入文本时启用复选框的主要内容,如果未能解决你的问题,请参考以下文章

统一启用隐藏移动输入后,输入字段不可编辑

我有多个复选框和多个文本输入。如果复选框被选中,则需要启用它旁边的文本输入

启用复选框时如何隐藏工具提示

如何使用 CSS 定位文本输入字段?

使用 jQuery 验证复选框和输入文本值

根据复选框条件验证输入文本字段(最大值和最小值)