Event handler for a html5 color input element

Question

Using the new input=\"color\" element within Chrome triggers a new popup dialog:

Answer 1

What you are looking for is the input event.

Your modified fiddle should now work in all (decent) browsers:

$('#colorinput').on('input', function() { ... } )

Answer 2

To get the value of color input, you should use the event attribute onchangeprovided in w3school

<input name="eventColor" type="color" onchange="getColorVal(eventColor.value)"/>

and define a function that handle the event

 function getColorVal(colorValue){

     alert(colorValue);
}

Answer 3

You really want input event per HTML spec. Nothing guarantees change event to fire before the input element has lost focus.

"The input event fires whenever the user has modified the data of the control. The change event fires when the value is committed, if that makes sense for the control, or else when the control loses focus. "