HTML | Propiedad de autocompletar color de entrada DOM

La propiedad de autocompletar color de entrada en HTML DOM se usa para establecer o devolver el valor del atributo de autocompletar de un campo de color de entrada. El atributo de autocompletar se usa para especificar si el atributo de autocompletar tiene un valor «activado» o «desactivado». Cuando el atributo de autocompletar está activado, el navegador completará automáticamente los valores en función de los que el usuario ingresó anteriormente.

Sintaxis:

  • Devuelve la propiedad de autocompletar Color de entrada.
    colorObject.autocomplete
  • Se utiliza para establecer la propiedad de autocompletar color de entrada.
    colorObject.autocomplete = "on|off" 

Valores de propiedad: contiene dos valores que se enumeran a continuación:

  • on: Es el valor por defecto. Completa automáticamente los valores.
  • off: Define que el usuario debe llenar los valores del campo de entrada de la URL. No completa automáticamente los valores.

Valor devuelto: Devuelve un valor de string que representa el estado de autocompletar.

Ejemplo 1: este ejemplo ilustra cómo devolver la propiedad de autocompletar color de entrada.

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        HTML DOM Input Color autocomplete Property 
    </title> 
</head> 
  
<body style="text-align:center;"> 
    <h1> 
        GeeksForGeeks 
    </h1> 
  
    <h2> 
        HTML DOM Input Color autocomplete Property 
    </h2> 
  
    <form id="myGeeks"> 
        <label> 
            Select your favorite color: 
        </label> 
  
        <input type="color" value="#009900"
                name="Geek_color" id="color"
                autocomplete="on"> 
    </form> 
  
    <button onclick="myGeeks()"> 
        Click Here! 
    </button> 
  
    <p id="GFG" style=
            "color:green;font-size:24px;"> 
    </p> 
  
    <script> 
        function myGeeks() { 
            var x = 
            document.getElementById("color").autocomplete; 
  
            document.getElementById("GFG").innerHTML = x; 
        } 
    </script> 
</body> 
  
</html>

Producción:

  • Antes de hacer clic en el botón:
  • Después de hacer clic en el botón:

Ejemplo 2: Este ejemplo ilustra cómo establecer la propiedad de autocompletar Color de entrada.

   
<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        HTML DOM Input Color autocomplete Property 
    </title> 
</head> 
  
<body style="text-align:center;"> 
    <h1> 
        GeeksForGeeks 
    </h1> 
  
    <h2> 
        HTML DOM Input Color autocomplete Property 
    </h2> 
  
    <form id="myGeeks"> 
        <label> 
            Select your favorite color: 
        </label> 
  
        <input type="color" value="#009900"
            name="Geek_color" id="color"
            autocomplete="on"> 
    </form> 
  
    <button onclick="myGeeks()"> 
        Click Here! 
    </button> 
  
    <p id="GFG" style=
        "color:green;font-size:24px;"> 
    </p> 
  
    <script> 
        function myGeeks() { 
            var x = 
            document.getElementById("color").autocomplete
                    = "off"; 
  
            document.getElementById("GFG").innerHTML
                    = "The value of the autocomplete "
                    + "attribute was changed to " + x; 
        } 
    </script> 
</body> 
  
</html>

Producción:

  • Antes de hacer clic en el botón:
  • Después de hacer clic en el botón:

Navegadores compatibles: los navegadores compatibles con la propiedad de autocompletar HTML DOM Input Color se enumeran a continuación:

  • Google Chrome
  • Firefox
  • Ópera

Publicación traducida automáticamente

Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *