3

我是 Web 开发的新手，在尝试应用相当简单的 javascript 代码时出现错误。假设我们有两个数字html5字段：

<label for="f1">First field</label>
            <input type="number" name="f1" id="f1" min="0" step="1" value="100"/>

<label for="f2">Second field</label>
            <input type="number" name="f2" id="f2" min="0" step="1" value="100"/>

现在我想对这些字段应用两个简单的规则。

当第一个字段的值更改时，此值（来自第一个字段）设置为第二个字段：

$("#f1").bind("change paste keyup", function()  {
    $("#f2").val($("#f1").val());  });

这很好用。

第二个字段的值不能超过第一个字段的值：

$("#f2").bind("change paste keyup", function()  {
    var f1_ = $("#f1").val();
    var f2_ = $("#f2").val();
    var f2_new = (f2_ > f1_)? f1_ : f2_;
    $("#f2").val(f2_new);  });

它适用于一些错误 - 当第二个字段的值为 10、100、1000、10000，...，并且我尝试减少它时，新值将等于第一个字段的值。 在此处查看示例

4

2 回答 2

3

即使输入类型是数字，从 .val() 返回的值的类型也是字符串。Number(f1_)要解决此问题，只需使用and转换回数字Number(f2_)。这是一个小提琴。看到转换之前，console.log( typeof f1_ )行日志string。

$("#f1").bind("change paste keyup", function() 
{
    $("#f2").val($("#f1").val()); 
});

$("#f2").bind("change paste keyup", function() 
{
    var f1_ = $("#f1").val();
    var f2_ = $("#f2").val();
    console.log( typeof f1_ );
    var f2_new = (Number(f2_) > Number(f1_))? f1_ : f2_;
    $("#f2").val(f2_new); 
});
于 2013-11-14T22:26:19.363 回答
1

我喜欢将+符号放在字符串前面以将其转换为数字。请参阅以下修复：http: //jsfiddle.net/fXnFF/531/

于 2013-11-14T22:32:51.293 回答