jscolor Bibliothek eingestellt Onchange Funktion für neue Eingänge

Question

Hallo I`m mit jscolor Farbauswahl aus http://jscolor.com/ ich von Ort neue Eingaben dynamisch Beispiel erstellen muß

function add() { 
    for(var i = 0; i < 100; i++) { 
     var input = document.createElement('INPUT') 
     var picker = new jscolor(input) 
     picker.fromHSV(360/100 * i, 100, 100) 
    document.getElementById('container').appendChild(input) 
    } 
} 

die Frage, wie Onchange Funktion richtig zu setzen und Lassen Sie jscolor sein Objekt mit Farbinformationen übergeben. Jetzt kann ich es nur gesetzt, für statische Elemente wie in exemple

<input class="jscolor" onchange="update(this.jscolor)" value="cc66ff"> 
<p id="rect" style="border:1px solid gray; width:161px; height:100px;"> 
<script> 
function update(jscolor) { 
// 'jscolor' instance can be used as a string 
document.getElementById('rect').style.backgroundColor = '#' + jscolor 
} 
</script> 

Hier ist mein Code nicht

var input = document.createElement('INPUT'); 
input.setAttribute("class", "jscolor"); 
input.setAttribute("onchange", "getColor(this)"); 
var picker = new jscolor(input); 
... //And then I add this input to parent and picker shows 

aber Onchange nicht ausgelöst funktioniert.

Answer 1

Ich suchte nach dem gleichen und mache es mit dem folgenden Code wokr. Hoffe das hilft!

var input = document.createElement('INPUT'); 
 
var picker = new jscolor(input, { 
 
    value: "00ff00" 
 
}); 
 

 
input.addEventListener('change', function(e){ 
 
    var color = e.target.value; 
 

 
    console.log(color); 
 
});