图像预览在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(); 
    }); 
});