2012-10-06 53 views
0

我有下面的腳本,點擊(從模態窗口)發送圖像的URL到輸入字段。我也將同一個網址imgurl發送到<div class="preview-image>,以便在插入時顯示它。

var BusiPress_Configuration = { 
    init : function() { 
     this.files(); 
    }, 

    files : function() { 
     if ($('.busipress_upload_image_button').length > 0) { 
      window.formfield = ''; 

      $('.busipress_upload_image_button').on('click', function(e) { 
       e.preventDefault(); 
       window.formfield = $(this).parent().prev(); 
       window.tbframe_interval = setInterval(function() { 
        jQuery('#TB_iframeContent').contents().find('.savesend .button').val(busipress_vars.use_this_file).end().find('#insert-gallery, .wp-post-thumbnail').hide(); 
       }, 2000); 
      if (busipress_vars.post_id != null) { 
       var post_id = 'post_id=' + busipress_vars.post_id + '&'; 
      } 
       tb_show(busipress_vars.add_new_file, 'media-upload.php?' + post_id +'TB_iframe=true'); 
      }); 

      window.original_send_to_editor = window.send_to_editor; 
      window.send_to_editor = function (html) { 
       if (window.formfield) { 
        imgurl = $('a', '<div>' + html + '</div>').attr('href'); 
        window.formfield.val(imgurl); 
        window.clearInterval(window.tbframe_interval); 
        tb_remove(); 
        $('.preview-image img').attr('src',imgurl); 
       } else { 
        window.original_send_to_editor(html); 
       } 
       window.formfield = ''; 
       window.imagefield = false; 
      } 
     } 
    } 
} 

BusiPress_Configuration.init(); 

發送圖像URL給編輯的DIV工作正常,但這樣做是爲了在頁面上該分區的每個實例。我一直在玩$(this)closest(),看我是否可以將插入本地化到輸入附近的特定div,但沒有任何運氣。任何幫助將不勝感激。謝謝!

默認標記

<table class="form-table"> 
    <tbody> 
     <tr valign="top"> 
     <th scope="row">Default Map Icon</th> 

     <td> 
      <input type="text" class="-text busipress_upload_field" id= 
      "busipress_settings_map[default_map_icon]" name= 
      "busipress_settings_map[default_map_icon]" value= 
      "http://localhost/jhtwp/wp-content/plugins/busipress/img/red-dot.png" /><span>&nbsp;<input type="button" 
      class="busipress_upload_image_button button-secondary" value= 
      "Upload File" /></span> <label for= 
      "busipress_settings_map[default_map_icon]">Choose the default map icon (if 
      individual business type icon is not set</label> 

      <div class="preview-image" style="padding-top:10px;"><img src= 
      "http://localhost/jhtwp/wp-content/plugins/busipress/img/red-dot.png" /></div> 
     </td> 
     </tr> 

     <tr valign="top"> 
     <th scope="row">Active Map Icon</th> 

     <td> 
      <input type="text" class="-text busipress_upload_field" id= 
      "busipress_settings_map[active_map_icon]" name= 
      "busipress_settings_map[active_map_icon]" value= 
      "http://localhost/jhtwp/wp-content/plugins/busipress/img/blue-dot.png" /><span>&nbsp;<input type="button" 
      class="busipress_upload_image_button button-secondary" value= 
      "Upload File" /></span> <label for= 
      "busipress_settings_map[active_map_icon]">Choose the active map icon (if 
      individual business type icon is not set</label> 

      <div class="preview-image" style="padding-top:10px;"><img src= 
      "http://localhost/jhtwp/wp-content/plugins/busipress/img/blue-dot.png" /></div> 
     </td> 
     </tr> 
    </tbody> 
    </table> 
+0

你可以請張貼標記嗎? – dpp

+0

當然 - 增加。謝謝! – Zach

回答

0

假設你已經可以選擇按鈕(我改成了「按鈕,選擇」爲同時),使用parent獲取父td然後找到孩子div改變。這將使您的按鈕到達最近的div

$("button-selector").parent('td').find("div") 
+0

謝謝!感謝幫助! – Zach