Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to get value of type="color" input using javascript

I used this above html code for my project..but i don't know how to get value of above input using javascript

<form>
  <input type="color" id="favcolor">
</form> 

can someone help me ?

Thanks

like image 437
user3624843 Avatar asked May 15 '14 18:05

user3624843


People also ask

How do you pick a color in HTML?

The <input type="color"> defines a color picker. The default value is #000000 (black). The value must be in seven-character hexadecimal notation. Tip: Always add the <label> tag for best accessibility practices!

Can I make the HTML color input only display hex?

You can't make it only display hex, but whatever mode the user chooses the value is stored as hex.

What is form tag value?

The value attribute specifies the value of an <input> element. The value attribute is used differently for different input types: For "button", "reset", and "submit" - it defines the text on the button. For "text", "password", and "hidden" - it defines the initial (default) value of the input field.

How do I put color in text in HTML?

<FONT COLOR= > To change some of the text in the HTML document to another color use the FONT COLOR Tag. To change the color of the font to red add the following attribute to the code to the <FONT COLOR=" "> tag. #ff0000 is the color code for red.


1 Answers

To simply get the value

document.getElementById("favcolor").value;

You can add an event listener if you want to get the color when the selection changes. You’d do something like this:

var theInput = document.getElementById("favcolor");

theInput.addEventListener("input", function(){
  var theColor = theInput.value;
  
  // Do something with `theColor` here.
}, false);
<input id="favcolor" type="color"/>

Here’s a working JSFiddle.

like image 107
Yaaso Avatar answered Oct 27 '22 11:10

Yaaso