Question

我的表单中有一个数字字段，可以在此处输入分数：

always @(posedge CLK)

在提交表单之前，我需要检查此字段是否已填写。我不想使用必需，因为当用户需要更多时间来确定输入分数时，我不想阻止用户。

我试图通过以下方法来获取总分的值：

<input type="number" min="0" max="100" class="form-control" name="total_score" id='total_score' value="<?php echo $total_score;?>" >(Please enter a score from 0-100)

但是似乎不起作用。有任何想法吗？谢谢。

Answer 1

value永远不会是null，因为它始终是字符串。您可以使用

var score  = document.getElementsById("total_score").value.trim();
if (!score) {
    alert("no score");
}

...因为任何非空白字符串（包括"0"）都是真实的。

确定其中有一个值后，您可以将其转换为数字（my answer here有多个选项），也可以使用输入的valueAsNumber属性。

注意：String#trim是在ES2015中添加的，因此除非您对其进行填充，否则它在IE8等过时的浏览器中将不存在。

旁注：我假设您问题中的getElementsById是一个错字，并且您的真实代码中有getElementById（没有s）。

Answer 2

让我们详细描述此问题。我们始终需要了解可以解决所有类似问题的内在问题。

<div class="score-field">
    <label for="total_score">(Please enter a score from 0-100)</label>
    <input 
      type="number"
      id="total_score"
      name="total_score" 
      min="0" 
      max="100" 
      value="<?php echo $total_score;?>">
</div>

如果我们想获取值document.getElementById('total_score').value。它返回String类型的值。

let value = document.getElementById('total_score').value;
console.log(typeof value) //'String'

所以String的值类型永远不会是null

let value = '';
console.log(value == null) //false

足够的讨论，对吧？

让我们解决问题。

const score = parseFloat(document.getElementById('total_score').value);

它将值String转换为Number。

假设

parseFloat("100"); // 100
parseFloat(''); //NaN

我们可以检查value是不是真的数字。

isNaN(value); // return true or false

我认为，这是您解决问题的方法。

完全解决：

HTML：

<div class="score-field">
        <label for="total_score">(Please enter a score from 0-100</label>
        <input 
          type="number"
          id="total_score"
          name="total_score" 
          min="0" 
          max="100">
</div>

JS：

const score = parseFloat(document.getElementById("total_score").value);

if(isNaN(score)){
   alert("no score");
}

Answer 3

这项工作：

            if(isNaN(parseInt(score))){
                alert("no score");
            }

Answer 4

这应该有效：

// first get the element
let element = document.getElementById('myInput');

// get the value property of the element
console.log(element.value);

//we could do a check the following way:

function change() {
  if (element.value > 100) {
    console.log('value too big');
  }

  if (element.value < 5) {
    console.log('value too small');
  }
}

<input type="number" value=5 id="myInput" oninput="change()"/>

如何获得输入类型编号的输入值？

4 个答案: