鳥舍圖像編輯器在第二張圖片上失敗

Question

我在鳥舍中鏈接到一個文件管理器來編輯我的文件存儲中的圖像。

從一系列大拇指我打開圖像到一次就可以在用戶點擊一個模態窗口，更新圖像的src屬性之前，我打開模態窗口

在模態窗口有一個按鈕在打開鳥舍的鳥舍編輯，加載圖像。

如果我點擊thumb1，然後編輯圖像，所有的預期效果都很好。我然後在編輯thumb2時遇到問題。

它會在模態窗口中打開正確的圖像，然後按預期正確打開圖像。然而 - 在加載鳥舍窗口的初始調整大小時出現問題。

臨時圖像最初顯示，然後在此圖像後面調整大小（出現更大的圖像）。臨時圖像保持在屏幕上，然後鳥舍中斷。

在新加載時，一切都按預期工作，但不會在第二次加載時運行。

我可以在控制檯日誌中看到的錯誤是：

Uncaught TypeError: Cannot call method 'isUsingHiResDimensions' of undefined 

有沒有一種方式，一旦我關閉模式的第一個圖像，清除鳥舍中的任何設置，給它一個乾淨啓動下一次？

我打電話鳥舍用此功能：

$(document).ready(function() { 
    $('.thumbnail').click(function(event) { 
     var imagePreview = $('#image1'); 
     imagePreview.attr('src',$(this).attr('href')); 
     $('#editImageLink').click(function(event) { 
      return launchEditor('image1', imagePreview.attr('src')); 
     }); 
     $('#imagePreview').modal('show'); 
     return false; 
    }); 
}); 

我的鳥舍初始化是在這裏：

var featherEditor = new Aviary.Feather({ 
    apiKey: 'mycode', 
    apiVersion: 3, 
    theme: 'dark', // Check out our new 'light' and 'dark' themes! 
    tools: 'all', 
    appendTo: '', 
    onSave: function(imageID, newURL) { 
     var img = document.getElementById(imageID); 
     img.src = newURL; 
    }, 
    onError: function(errorObj) { 
     alert(errorObj.message); 
    } 
}); 
function launchEditor(id, src) { 
    featherEditor.launch({ 
     image: id, 
     url: src 
    }); 
    return false; 
} 

不知道我需要做什麼來清除並重新開始比刷新頁面等，任何幫助表示讚賞。

Answer 1

您正在將越來越多的點擊事件綁定到editImageLink，因此該代碼正在運行多次。

適當的結合將是：

$(document).ready(function() { 
    var imagePreview = $('#image1'); 

    $('.thumbnail').click(function(event) { 
     imagePreview.attr('src',$(this).attr('href')); 
     $('#imagePreview').modal('show'); 
     return false; 
    }); 

    $('#editImageLink').click(function(event) { 
     return launchEditor('image1', imagePreview.attr('src')); 
    }); 
});