HTML Input Range disabled用法及代码示例

DOM输入范围禁用属性用于设置或返回是否必须禁用输入范围字段。禁用范围字段是un-clickable，并且不可用。它是一个布尔属性，用于反映HTML Disabled属性。默认情况下，在所有浏览器中通常以灰色显示。

用法:

它返回禁用的属性。
```
rangeObject.disabled
```
用于设置禁用的属性。
```
rangeObject.disabled = true|false
```

属性值：

true:它定义了输入范围字段被禁用。
False:它具有默认值。它定义了输入范围字段未禁用。

返回值：它返回一个布尔值，表示是否禁用了输入范围字段。

示例1：本示例说明了如何返回属性。

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        HTML DOM Input disabled Property 
    </title> 
</head> 
<style> 
    #Geek_p { 
        font-size:30px; 
        color:green; 
    } 
</style> 
  
<body style="text-align:center;"> 
  
    <h1 style="color:green;">  
            GeeksForGeeks  
        </h1> 
  
    <h2> 
      DOM Input Range disabled property 
  </h2> 
    <form id="geeks"> 
        <input name=G 
               eek_range type="range" 
               id="Geek_Range"
               value="90"
               disabled> 
    </form> 
    <br> 
    <br> 
    <button onclick="myGeeks()"> 
        Click Here 
    </button> 
    <p id="Geek_p"></p> 
    <script> 
        function myGeeks() { 
            
            // Return input range property. 
            var x =  
            document.getElementById( 
              "Geek_Range").disabled; 
            
            
            document.getElementById( 
              "Geek_p").innerHTML = x; 
        } 
    </script> 
</body> 
  
</html>

输出：
在单击按钮之前：

单击按钮后：

示例2：本示例说明了如何设置属性。

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        HTML DOM Input disabled Property 
    </title> 
</head> 
<style> 
    #Geek_p { 
        font-size:30px; 
        color:green; 
    } 
</style> 
  
<body style="text-align:center;"> 
  
    <h1 style="color:green;">  
            GeeksForGeeks  
        </h1> 
  
    <h2> 
      DOM Input Range disabled property 
  </h2> 
    <form id="geeks"> 
        <input name=G 
               eek_range type="range" 
               id="Geek_Range"
               value="90" 
               disabled> 
    </form> 
    <br> 
    <br> 
    <button onclick="myGeeks()"> 
        Click Here 
    </button> 
    <p id="Geek_p"> 
  </p> 
    <script> 
        function myGeeks() { 
            
            //  Set input range disabled property 
            var x =  
                document.getElementById( 
                "Geek_Range").disabled = false; 
            
            
            document.getElementById( 
              "Geek_p").innerHTML = x; 
        } 
    </script> 
</body> 
  
</html>

输出：
在单击按钮之前：

Aftre单击按钮：

支持的浏览器：禁用DOM输入范围支持的浏览器属性列出如下：

谷歌浏览器
Internet Explorer 10.0以上
Firefox
Opera
Safari

相关用法

注：本文由纯净天空筛选整理自ManasChhabra2大神的英文原创作品 HTML | DOM Input Range disabled Property。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。