jquery - Event for change input type color JavaScript -


i want new color on input type=color, if use jquery it's working

$(document).ready(function() {     var colorpicker = $('.input-color');          colorpicker.on("change", function watchcolorpicker() {             var val = $(this).val();             $(".title").each(function() {                 $(this).css({'color' : val});             });         }); }); 

but don't know, how write on native js. error .change or .on not function

window.onload = function(){      var colorpicker = document.getelementsbyclassname('input-color');     var text = document.getelementsbyclassname('title');      function colorchange(color) {         for(var j =0; j < color.length; j++) {              color[j].addeventlistener('change', function () {                 var newcolor = this.value;                  for(var =0; < text.length; i++) {                     text[i].style.color = newcolor;                 }             })         }     }      colorchange(colorpicker); }; 

i've compressed pure js code little bit, looks clean , light. reduced number of loops.

const colorpicker = document.queryselector('#input-color');  const elems = document.queryselectorall('.title');    colorpicker.addeventlistener('change', function() {    array.from(elems).foreach(v => v.style.color = this.value);  });
<input id="input-color" type='color' />  <p class='title'>first</p>  <p class='title'>second</p>  <p class='title'>third</p>


Comments

Popular posts from this blog

php - Vagrant up error - Uncaught Reflection Exception: Class DOMDocument does not exist -

vue.js - Create hooks for automated testing -

Add new key value to json node in java -