Color Picker (Iris) im Widget – Aktualisieren, wenn in Customizer bearbeitet

Ich habe die WordPress Core Farbauswahl (Iris) zu einem von mir entwickelten Widget hinzugefügt, aber wenn ich die Farbe bearbeite, wird keine Änderung ausgetriggers. Daher wird der Iframe (Live-Vorschau) für den Customizer nur aktualisiert, wenn Sie eine Änderung in einem anderen Eingabefeld auslösen.

JavaScript, um den Farbwähler zu initialisieren:

var myOptions = { // you can declare a default color here, // or in the data-default-color attribute on the input defaultColor: '#000', // a callback to fire whenever the color changes to a valid color change: function(event, ui){ }, // a callback to fire when the input is emptied or an invalid color clear: function() {}, // hide the color picker controls on load hide: true, // show a group of common colors beneath the square // or, supply an array of colors to customize further palettes: true }; // Add Color Picker to all inputs that have 'color-field' class $('.color-field').wpColorPicker(myOptions); 

Hinweis: Ich habe das Hinzufügen des folgenden Codes zum Änderungsrückruf getestet.

 change: function(event, ui){ $(this).trigger('change'); }, 

Dadurch wird eine Änderung ausgetriggers und der IFrame aktualisiert, wenn der Benutzer auf die Farbauswahl klickt, dies geschieht jedoch, bevor der Farbwert gespeichert wird.

Weiß jemand zufällig, wie er auf das Ereignis zugreifen kann, nachdem die ausgewählte Farbe gespeichert wurde?

Solutions Collecting From Web of "Color Picker (Iris) im Widget – Aktualisieren, wenn in Customizer bearbeitet"

Ich weiß nicht, woher der iFrame seine Farbinformationen bezieht, aber Sie müssen wahrscheinlich die ausgewählte Farbe aus dem Farbwähler in dieses Feld schreiben.

Dies ist ein Beispiel mit Drosselung. update_color ist eine function, die sich mit der neuen Farbe beschäftigt. Sie können dort einen Code eingeben, der die ausgewählte Farbe an die richtige Stelle in Ihrer Situation bringt.

  change: $.proxy( _.throttle(function(event, ui) { event.preventDefault(); var color = ui.color.toString(); update_color(event,ui, color); }, 200), this),