為什么Settimeout沒有拉出更新的圖片網址？

Question

我正在使用Aviary在線編輯圖像。 通常我有一個本地文件，我點擊，編輯和保存。

保存后，圖像的src路徑從本地“uploadedimage.jpg”變為長的臨時URL，如：

http://featherfiles.aviary.com/2013-07-01/kvs78lgyil6sxlc5/69318ad57a1d490d8215cc1097cf6c32.png

我想在編輯完成后讓JavaScript獲取更新的URL。 我嘗試設置“settimeout”參數，但它仍然抓住圖像的原始本地URL。

<!-- Load Feather code -->
<script type="text/javascript" src="http://feather.aviary.com/js/feather.js"></script>

<!-- Instantiate Feather -->

<script type='text/javascript'>
 var featherEditor = new Aviary.Feather({
   apiKey: 'apikey',
   apiVersion: 2,
   tools: 'all',
   appendTo: '',
   onSave: function (imageID, newURL) {
       var img = document.getElementById(imageID);
       img.src = newURL;
setTimeout(function(){fillform()}, 5000);
 },
   onError: function(errorObj) {
       alert(errorObj.message);
   }
   });
   function launchEditor(id) {
   featherEditor.launch({
       image: id
   });
  return false;
   }
</script>


<div id='injection_site'></div>
<%= form_for @post, :html => { :class => 'form-horizontal' } do |f| %>
<img id='image1' <%= image_tag @post.productimage_url.to_s %>
<% end %>
<!-- Add an edit button, passing the HTML id of the image and the public URL of the image -->
<p><input type='image' src='http://images.aviary.com/images/edit-photo.png' value='Edit photo' onclick="return launchEditor('image1');" /></p>



<script type="text/javascript" language="JavaScript">
var bob = document.getElementById('image1').src;
var fillform = function ()
{
setTimeout(function(){document.getElementById("textbox1").value=bob}, 3000);
}
</script>

myformfield: <input type="text" name="name_textbox" id="textbox1" />

Answer 1

這很可能是因為：

var bob = document.getElementById('image1').src;

正在制作字符串的副本 。 因此，當你運行：

document.getElementById("textbox1").value=bob

您正在使用最初定義時的字符串。 您可能希望將回調更改為：

setTimeout(function()
   {
      var bob = document.getElementById('image1').src; // Get current value
      document.getElementById("textbox1").value=bob
   }, 3000);

然后你也可以擺脫全局的bob變量。

修復它的另一種方法是改變你的onSave回調：

img.src = newURL;

至：

bob = img.src = newURL; // Update bob