當URL輸入到文本框中時，用於顯示圖像的Javascript或JQuery

Question

有沒有人有Javascript或JQuery的示例，它會根據在html頁面上輸入的文本框中的URL自動顯示圖像？

謝謝。

Answer 1

這有大約元素ID假設，但做了你問什麼...

$(function() { 
    $("#textbox").on("change", function() { 
    $("#image").prop("src", $(this).val()); 
    }); 
}); 

它假定您有與textbox ID和與image的ID圖像的輸入。一旦你完成在文本框中輸入並離開它，圖像將加載你輸入的URL（只要它是一個有效的圖像）。

Answer 2

嘗試使用這樣的：（wokring codepan）

$(function(){ 
    $('input').blur(function(){ 
     $('#container').html('<img alt="" src="'+$(this).val()+'">'); 
    }); 
}) 

這將圖片添加到頁面中，你離開的輸入和第二（blur事件）。如果您願意，可以將其更改爲keyup。