Hinzufügen eines Onchange-Ereignisses zu einem benutzerdefinierten Dropdown-Menü in WordPress

Ich möchte ein Onchange-Ereignis zu einem Dropdown-Menü hinzufügen, das ich über mein WordPress-Plugin erstellt habe. Da dies mein erster Ausflug in die WordPress-Entwicklung ist und das Unternehmen, für das ich arbeite, eine große Menge an Aufgaben hat, habe ich Mühe zu verstehen, wie das geht.

Das ist, was ich habe: Ich habe ein Plugin, das eine Basis-URL in eine WordPress-Site über einen kurzen Code einbettet. Das Plugin hat eine Admin-Einstellungsseite, auf der der Benutzer die Basis-URL ändern kann. In der PHP-Datei meines Plugins habe ich eine function, die ein Dropdown-Menü zurückgibt und die Basis-URL einbettet:

function embed_url() { $dropdown_menu = 'OptionDefaultOption1Option2'; $full_url = '

URL could not be loaded.

'; return $dropdown_menu . $full_url; }

Die Variable $ embed_this_url ist der Wert einer in der WP-database gespeicherten Option. Der Wert könnte beispielsweise ” http://www.mysite.com ” lauten.

Was ich möchte: Ich möchte, dass mein Dropdown-Menü die eingebettete Website ändert. Wenn der Benutzer mit Option 1 die Option 1 auswählt, wäre die eingebettete Site $ embed_this_url + ‘? Id = 1’ (mit anderen Worten: http://www.mysite.com?id=1 ). Daher muss ich einige Javascript hinzufügen, um eine Onchange-function zu machen, um die mit $ embed_this_url plus den Wert des ausgewählten zu aktualisieren.

Wie würde ich das umsetzen?

Solutions Collecting From Web of "Hinzufügen eines Onchange-Ereignisses zu einem benutzerdefinierten Dropdown-Menü in WordPress"

Ich habe einen Wrapper zu Ihrer HTML-Ausgabe hinzugefügt und dann einen jQuery-Code geschrieben, den Sie verwenden können –

 function embed_url() { $dropdown_menu = ''; $full_url = '

URL could not be loaded.

'; return '
' . $dropdown_menu . $full_url . '
'; }

jQuery-Code –

 jQuery(document).ready(function($){ $('.site-url select').on('change', function(){ var param = $(this).val(); var url = $('.site-url object').attr('data'); url += param; $('.site-url object').attr('data', url); }); });