根据文本框中值的大小将按钮绑定到多个激活的文本框答案

【问题标题】：Binding Buttons to several text boxes actived based on size of values in text box根据文本框中值的大小将按钮绑定到多个激活的文本框
【发布时间】：2012-08-04 18:48:51
【问题描述】：

我正在建立一个网站，人们可以在其中定制产品的形状，然后再订购。

最终会有几个按钮绑定到四个文本框。当用户在文本框中输入更高的值时，被激活的按钮会发生变化，因此我们知道需要为该客户的设计订购什么尺寸的材料。

如何根据放置在文本框中的值创建一个启用/禁用的按钮？

【问题讨论】：

标签： javascript html data-binding button textbox

【解决方案1】：

您可以使用 jQuery 并尝试以下方法：

首先，给你的按钮一个属性disabled="disabled"，然后：

//Assuming they are typing, if it's a dropdown/select, see below

$('#input-id').on('keyup', function() {
    if($(this).val() >= 10 && $(this).val() <= 20) { // If the value is between 10 and 20...
      $('#button-id').removeAttr('disabled'); // Remove disabled attribute
    } else { // If the value is not our keyword...
      if(!$('#button-id').attr('disabled')) { // And the button is not disabled...
        $('#button-id').attr('disabled', 'disabled'); // Readd disabled attribute
      }
    }
});

如果您使用下拉菜单或选择框，请使用$("select option:selected")。

【讨论】：

感谢您的帮助，这太棒了，但如果您不介意再提两个问题。 1）是否可以修改此代码，以便“somevalue”在 10 到 20 之间的范围内激活按钮 2）如何使按钮依赖于输入到多个文本框中的值？
@MattStephens 我编辑了答案以检查数字范围。只需使用$(this).val() >= 10 检查该值是否大于或等于10，使用&& $(this).val() <= 20 检查该值是否小于或等于20。要添加更多范围，只需添加else if(...)。