如何处理“SEND_TO_EDITOR”js函数多个实例

时间:2012-05-02 作者:Sisir

以下是我正在做的:

我添加了wordpress media upload,当点击按钮或链接时,会弹出iframe弹出窗口。然后单击insert into post,将图像url放置在文本框中。

send_to_editor() function handles image insertion to editor

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();
    }
因此,您会看到默认的send\\u to\\u编辑器已编辑和更改。现在,当我尝试从wordpress编辑器上传图像时,请上传图像并单击插入图像以发布。它不起作用。

Question: 如何创建多个send_to_editor() 或者parhaps创建新的js函数并将其挂接到图像上传器的每个瞬间,这样它们就不会冲突了?

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;
}

4 个回复
最合适的回答,由SO网友:Bainternet 整理而成

仅在单击链接或按钮时覆盖send\\u to\\u editor功能,但存储旧功能以还原它,因此请在单击事件中尝试以下操作:

//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;
}

SO网友:Welcher

我的做法与“班纳特”的做法相似。然而,情况略有不同。长话短说,我有多个按钮打开添加媒体窗口,这打破了TinyMCE的默认功能。

创建一个存储2项的对象:

var $state_manager = {
      active_item : \'null\',
      default_send_to_editor: window.send_to_editor
}
单击时,自定义按钮将更改active\\u项目的值:

 $(\'.button\').click(function(){
    $state_manager.active_item = $(this).attr(\'data-unqiue-id\');
    // open the window and do whatever else you need
 })
检查active\\u项的状态,执行自定义工作或调用存储的默认函数,完成后将active\\u项设置为null。

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\';
 }
}
存储活动\\u项目的一个好处是针对不同的输入字段,并用上传项目的url填充它们。

SO网友:l2aelba

我只是把window.send_to_editor\'中的s函数.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;
});

SO网友:Lee

我创建了一个插件,它与添加媒体编辑器冲突。因此,我改变了以下内容:

$(\'#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; 
    }); 

结束

相关推荐

处理jQuery组件冲突

在插件开发中,防止jQuery组件在前端发生冲突的最佳实践是什么?例如,假设我在一个插件中包含jQuery Apprise对话框,该插件将此对话框加载到前端,另一个插件可能也会这样做。因为这会被加载和声明两次,或者其中一个是分叉和自定义的,而我的不是,所以我们在前端会出现Javascript错误(我假设)。(注意,为了在前端加载jQuery组件,我正在通过wp\\u head()操作事件使用wp\\u register\\u script()和wp\\u enqueue\\u script()策略的最佳实