Почему мой сценарий выбора СМИ записывает ТОЛЬКО первое поле ввода?

Поэтому я создаю метабокс для нескольких дополнительных изображений, которые можно показать на postloop. Простые вещи, которые я думал, пока я не пишу сценарий для дополнительных изображений.

Вот что я имею до сих пор:

два поля формы

Поэтому я создал сценарий для вызова медиа-бокса, и я могу заставить его писать то, что мне нужно, но при вызове второго медиа-бокса он просто записывается в первый раз каждый раз, хотя мой селектор должен быть другим. Вот сценарий:

(function( $ ) { 'use strict'; $(function() { var meta_image_frame; function saveImage(e,uiElement){ e.preventDefault(); if ( meta_image_frame ) { meta_image_frame.open(); return; } meta_image_frame = wp.media.frames.meta_image_frame = wp.media({ title: meta_image.title, button: { text: meta_image.button }, library: { type: 'image' } }); meta_image_frame.on('select', function(){ var media_attachment = meta_image_frame.state().get('selection').first().toJSON(); $(uiElement).val(media_attachment.url); }); // Opens the media library frame. meta_image_frame.open(); } $('#fa_img1-button').click(function(e){ saveImage(e,'#fa_img1'); }); $('#fa_img2-button').click(function(e){ saveImage(e,'#fa_img2'); }); }); })( jQuery ); 

Как вы можете видеть, я вызываю кнопку fa_img1 ID и кнопку fa_img2 для нажатой кнопки и идентификатор поля формы, который является fa_img1 & 2

Мысли?

эта проблема возникает из-за первого «если», то хорошее текстовое поле устанавливается только в первый раз

Чтобы изменить это, вы можете добавить аргумент «данных» в HTML и изменить код JavaScript (см. модификацию в meta_image_frame.on('select' …)

 (function($) { 'use strict'; $(function() { var meta_image_frame; function saveImage(e, uiElement) { e.preventDefault(); if (meta_image_frame) { meta_image_frame.field = $("#" + $(e.target).data("field")); meta_image_frame.open(); return; } meta_image_frame = wp.media.frames.meta_image_frame = wp.media({ title : "meta_image.title", button : { text : "meta_image.button" }, library : { type : 'image' } }); meta_image_frame.on('select', function() { var media_attachment = meta_image_frame.state() .get('selection').first().toJSON(); meta_image_frame.field.val(media_attachment.url); }); // Opens the media library frame. meta_image_frame.open(); } $('#fa_img1-button').click(function(e) { saveImage(e, '#fa_img1'); }); $('#fa_img2-button').click(function(e) { saveImage(e, '#fa_img2'); }); }); })(jQuery); 

вы можете использовать его в этом HTML-коде:

 <input id="fa_img1" type="text" value=""/> <br/> <input id="fa_img1-button" type="button" data-field="fa_img1" value="Upload Image"/> <br/> <br/> <input id="fa_img2" type="text" value=""/> <br/> <input id="fa_img2-button" type="button" data-field="fa_img2" value="Upload Image"/> <br/> <br/>