在 jQuery 中使用 typeof 运算符时遇到问题

Question

这将是第一次，所以我不会以“我是编程新手”作为我的问题的开头（哎呀）。我会直接进入它：

这是我的 HTML 代码：

<div class="hide" id="hide2">
    <div class="inputselect">   
    <p>
        <label>What is your budget?</label>
        </p>
        <p>
            Minimum: $<input type="text" id="minBud" name='minBud'><br />
            Maximum: $<input type="text" id="maxBud" name='maxBud'><br />
        <br />
        </p>
        <button type="button" class="next" id="next3">Next</button>
        <button type="button" class="prev" id="prev2">Previous</button> 
    </div>
</div>

这是我正在努力解决的 jQuery/javascript 代码 sn-p：

$("#next3").click(function(){
    if (typeof $("#minBud").val() === "number" && typeof $("#maxBud").val() === "number") { 
        gunsPrice();
        $("#hide3").slideDown("fast");
        $("#hide2").slideUp("fast");
    } else {
        alert("Please only enter NUMBERS into the budget fields");
    }
});

我希望看到的是：如果 minBud 和 maxBud 字段中的条目是数字，则运行 gunsPrice() 并提出下一个问题（HTML 表单）。

我尝试了几种不同的方式来改变语法，但无论我怎么做，数字都会继续触发alert。

注意：我可以让typeof 运算符在gunsPrice() 中正常运行（使用通过getElementById 收集的变量，但这在此应用程序中对我没有任何好处；它总是转到下一个问题（由于我设置 jQuery 代码的方式）。

谢谢！

Answer 1

.val() 总是返回一个字符串作为输入。所以你的条件总是会评估为假。但是，您可以检查结果是否仅包含数字（如果这是您要查找的内容）

if (/^\d+$/.test($("#minBud").val()) && /^\d+$/.test($("#maxBud").val())) {

Answer 2

我现在看到您可以在 jQuery 中添加挂钩，以便 .val() 可以返回一个数字。您可以使用以下代码连接到 val()：

$.valHooks.text={
  get:function(elem){
    var i=parseFloat(elem.value,10);
    return (isNaN(i))?elem.value:i
  }
}

现在任何输入类型文本的 val() 都将返回一个字符串或数字，具体取决于它是否可以转换。

这可能会令人困惑，因为输入类型是 TEXT。

您可以使用 $valHooks.number 并设置类型 number 的输入，但在 Firefox 20.0.1 中尝试过，但没有成功。

这是因为 jQuery 尝试使用

获取钩子

jQuery.valHooks[ elem.type ] 

由于 FireFox 在请求“数字”类型的 elem.type 时将返回“文本”，因此它不会调用您的钩子并返回 elem.value 属性，它是字符串。这可能是 FireFox 中的一个错误，因为

elem.getAttribute("type")

返回“数字”

克服此错误的一种方法是进入 jQuery 源代码并更改以下行：

hooks = jQuery.valHooks[ elem.type ] || jQuery.valHooks[ elem.nodeName.toLowerCase() ];

到

hooks = jQuery.valHooks[ elem.type ] || jQuery.valHooks[ elem.nodeName.toLowerCase() ]
  || jQuery.valHooks[ elem.getAttribute("data-type") ];

现在在您的 html 中，您可以通过以下方式指定数字输入字段：

<input type="number" data-type="number" ...

并添加一个数字钩子：

$.valHooks.number={...//see code above for the rest

Answer 3

在$("#minBud").val() 中，#minBud 是输入或文本区域。

您的操作：

typeof $("#minBud").val() 

是一个“字符串”。

parseInt($("#minBud").val(),10) === null