web-dev-qa-db-fra.com

Comment gérer plusieurs instances de la fonction "send_to_editor" js

Voici ce que je fais:

J'ai ajouté le téléchargement de média wordpress avec le popup iframe lorsqu'un bouton ou un lien a été cliqué. Et avec un clic d'insertion dans le post, l'URL de l'image placée sur une zone de texte.

La fonction send_to_editor() gère l'insertion d'images dans l'éditeur 

window.send_to_editor = function(html) {
     var imgurl = jQuery('img',html).attr('src');
     current_item.siblings('.upload_image').val(imgurl);
     current_item.parent().prepend('<div><img width="300" src="'+imgurl+'" alt="banner image" /></div>');
     tb_remove();
    }

Donc, vous voyez que le send_to_editor par défaut est édité et modifié. Maintenant, quand j'essaie de télécharger l'image à partir de WordPress Editor image téléchargée et cliquez sur Insérer une image pour poster. Ça ne marche pas.

Question: Comment faire pour que plusieurs instances de send_to_editor() ou de Parhaps créent et raccrochent une nouvelle fonction js à chaque instant de l'utilitaire de transfert d'images afin d'éviter tout conflit?

Solution: 

var original_send_to_editor = window.send_to_editor;

window.send_to_editor = function(html) {
     var imgurl = jQuery('img',html).attr('src');
     current_item.siblings('.upload_image').val(imgurl);
     //current_item.siblings('#logo').remove();
     current_item.siblings('.image-preview').html('<img src="'+imgurl+'" >');    
     tb_remove();
     window.send_to_editor = original_send_to_editor;
}
jqueryuploadsjavascriptwp-editor
4
Sisir

écrasez uniquement la fonction send_to_editor lorsque votre lien ou bouton est cliqué, mais stockez l'ancienne fonction pour la restaurer; essayez ceci avec un événement de clic:

//store old send to editor function
window.restore_send_to_editor = window.send_to_editor;
//overwrite send to editor function
window.send_to_editor = function(html) {
     var imgurl = jQuery('img',html).attr('src');
     current_item.siblings('.upload_image').val(imgurl);
     current_item.parent().prepend('<div><img width="300" src="'+imgurl+'" alt="banner image" /></div>');
     tb_remove();
     //restore old send to editor function
     window.send_to_editor = window.restore_send_to_editor;
}
7
Bainternet

Mon approche était similaire à celle de @ Bainternet. Les circonstances étaient cependant légèrement différentes. Pour résumer, plusieurs boutons ouvraient la fenêtre Ajouter un média et cédaient la fonctionnalité par défaut de TinyMCE.

  1. Créez un objet qui stocke 2 éléments:

    var $state_manager = {
      active_item : 'null',
      default_send_to_editor: window.send_to_editor
}

  2. Les boutons personnalisés vont changer la valeur de active_item quand on clique dessus:

     $('.button').click(function(){
    $state_manager.active_item = $(this).attr('data-unqiue-id');
    // open the window and do whatever else you need
 })

  3. Vérifiez l'état de active_item et effectuez un travail personnalisé ou appelez la fonction par défaut stockée et définissez active_item sur null une fois l'opération terminée.

    window.send_to_editor = function( html ) {
 if($state_manager.active_item === 'null') {
   //call the default
   $state_manager.default_send_to_editor( html );
 }else{
   //do some custom stuff here being sure to reset
   // active_item to 'null' once completed
   $state_manager.active_item = 'null';
 }
}

Un avantage du stockage de l'élément active_item est de cibler différents champs d'entrée et de les renseigner avec l'URL de l'élément téléchargé.

3
Welcher

Je viens de mettre la fonction de window.send_to_editor dans la fonction .click()

$('#upload_button_1').click(function() {
                            tb_show('','media-upload.php?type=image&amp;TB_iframe=true');

                            window.send_to_editor = function(html) {
                            imgurl = jQuery('img',html).attr('src');
                            // do some rock 
                            tb_remove();
                            }
                            return false;
});
1
l2aelba

J'ai créé un plugin et il est en conflit avec Add Media on Editor. Alors je change de suite:

$('#upload_button').click(function() { 
       tb_show('Upload a logo', 'media-upload.php?type=image&TB_iframe=true&post_id=0', false); 

         //store old send to editor function
        window.restore_send_to_editor = window.send_to_editor;
        // Display the Image link in TEXT Field
        window.send_to_editor = function(html) { 
            var image_url = $('img',html).attr('src'); 
            $('.logofield').val(image_url); 
            tb_remove(); 
            window.send_to_editor = window.restore_send_to_editor;
        } 

       return false; 
    });
0
Lee