圖像預覽在Rails視圖與JS

Question

我有一個text_field是一個圖像的網址，我想加載它和img標記。我還想在image_url文本框丟失焦點時更新圖像，以便它們可以更改網址並查看預覽。

下面是視圖相關ERB：

<div class="control-group"> 
    <%= f.label :image, :class => 'control-label' %> 
    <div class="controls"> 
     <%= f.text_field :image_url, :class => 'text_field', id: "image_url" %> 
    </div> 
    </div> 

    Preview: <img id="preview" src=""> 

和嵌入式JS ...

<script type="text/javascript"> 

document.observe('dom:loaded', function() { 
    $('preview').src = $('image_url').text 
    $('image_url').bind("focusout",function(){ 
    $('preview').src = this.text 
    )} 

}); 

在負載我得到什麼和Src不會改變

Answer 1

您需要指定您嘗試查找的對象的選擇器。另外我會使用文檔準備好。

$(document).ready(function() { 
    $('#preview').src = $('#image_url').text(); 
    $('#image_url').bind("focusout",function(){ 
    $('#preview').src = this.text(); 
    }); 
});