HTML/JS - 讓用戶粘貼圖片網址作爲背景

Question

我有一些我想要做的事，但我不確定這是可能的。

我想要一個文本框（輸入），並且當用戶粘貼一個圖像的URL（說，他們的Facebook個人資料圖片）時，它將採取該URL並將其設置爲網站上的背景圖像URL。

這可能嗎？有人可以寫一個代碼嗎？似乎如果有可能，它應該不會太難..

在此先感謝。

Answer 1

<script type="text/javascript"> 
function changebackground(){ 
    var url = document.getElementById('bgchanger').value; 
    document.getElementsByTagName('body')[0].style.backgroundImage = "url('" + url + "')"; 
} 
</script> 
<input type="text" id="bgchanger" value="Enter a background URL" /> 
<input type="button" onclick="changebackground();" value="Change!" /> 

未經測試，但應該沒問題。

編輯測試和完美的作品：http://jsfiddle.net/EK3Y3/

Answer 2

是的。您可以使用jQuery輕鬆實現，儘管您也可以使用JavaScript。

下面是一個例子。 http://jsfiddle.net/FvDWw/

將有效的圖像url粘貼到該文本框中。

Answer 3

您可以通過一個處理程序連接到輸入元素的「改變」事件做到這一點。然後使用輸入元素的值來更新「body」元素的CSS的「background-image」屬性。

例如，http://jsfiddle.net/aB3sg/