Question

我希望输入框只接受类型为（20-40）的值，就像20-40之间的单个数字一样，我告诉用户要定义该特定输入框的范围？

任何人都可以帮助我做同样的事情。感谢。

Answer 1

有一个名为number的输入元素类型。希望这可能对你有所帮助。

它有属性

最小 - 最小值
最大值 - 最大值
Step - Increment By。

<input type="number" min="10" max="20" step="2" value="10"/>

Answer 2

在HTLM5中，有一个设置范围界限的选项。请查看此https://jsfiddle.net/ozgsn5pn/2/

<h3>A demonstration of how to access a Slider Control</h3>
<input type="range" id="myRange" min="20" max="40" value="30">
<p>Click the button to get the value of the slider control.</p>
<button onclick="myFunction()">Try it</button>
<p><strong>Note:</strong> input elements with type="range" are not supported in IE 9 and earlier versions.</p>
<p id="demo"></p>

Answer 3

尝试使用此代码验证输入框的范围是20到40。

    <script>
    function validate() {
    var n= document.getElementById("txtnum").value;
    if(!(n >= 19&& n <= 41))
       document.getElementById("txtnum").value="";
       alert("please enter valid no from 20-40");
    }
    </script>
    <input type="number" id="txtnum" onblur="validate();">

Answer 4

尝试这样的事情（＃20-40）：

JavaScript的：

    function myFunction() {
        var x = document.getElementById("input").value;
        if (x<20 || x>40) {
        document.getElementById("warning").innerHTML = "Choose a number between 20 and 40";
        }  else document.getElementById("warning").innerHTML = " ";
    }

HTML

Example: <input id="input" onchange="myFunction()" placeholder="Choose number between 20 and 40">

<p id="warning"></p>

Answer 5

＆＃13;

function checkrange()    
{
   var input=parseInt(document.getElementById("number").value);
   //alert(input);
   if(input<=10)
   {
      // alert('hi');
       document.getElementById("mySelect").value = "one";
       //document.getElementById("mySelect").selectedIndex="1";
     
       
   }
   else if((input>10)&&(input<20))
   {
       //alert('h')
        document.getElementById("mySelect").value = "two";
   }
   
   else if((input>20)&&(input<30))
   {
       //alert('h')
        document.getElementById("mySelect").value = "three";
   }
   else
   {
       alert('Invalid Range')
       document.getElementById("mySelect").value = "empty";
   }


}

＆＃13;

<form>
Please enter a number in textfield :
<select id="mySelect">
    <option value="empty"></option>
    <option value="one">1-10</option>
  <option value="two">11-20</option>
  <option value="three">21-30</option>
  
</select>
<input type="number" id="number" onkeyup="checkrange();" placeholder="Enter a number between 1-30" min="1" max="30" style="width: 200px;">
  </form>

＆＃13;

您好，

感谢您发布问题。

我对你的答案略有不同，也许你也可以采用它。

我所做的是用户必须输入一个值或一个数字，并根据该值更改选择框选项。

运行上面的代码段。可能会有所帮助。

感谢和快乐的编码：）

如何设置文本框以接受值作为范围？

5 个答案: