輸入標籤內的鏈接

如何在輸入框（文本框）內顯示a href和img src。例如：我想在文本框中顯示此內容（<input id=link）輸入標籤內的鏈接

<a href="http://www.mysite.com/link" target="_blank"><img src="http://www.mysite.com/img.jpg" border="0" alt="mysite.com"></a>

在此先感謝。

來源

2011-08-05 maxlk

你爲什麼想要把裏面的鏈接輸入框？ – JJJ

你不能把它放進去，但你可以把它放在絕對或相對的位置。 –

您不需要將其放在輸入標籤內即可實現您正在嘗試執行的操作。 – awesomesyntax

基於評論，我猜想你想要一個輸入字段，該HTML代碼作爲默認文本。您必須使用字符參考碼進行報價並且小於/大於符號。

<input type="text" value="&lt;a href=&quot;http://www.mysite.com/link&quot; target=&quot;_blank&quot;&gt;&lt;img src=&quot;http://www.mysite.com/img.jpg&quot; border=&quot;0&quot; alt=&quot;mysite.com&quot;&gt;&lt;/a&gt;" />

（順便說一下，你提到「像的photobucket」 - 你可以看一下網站的HTML，看看他們是如何做到這一點。）

來源

2011-08-05 16:46:31 JJJ

正是我想要的。謝謝 – maxlk

正如評論提到的，你不能從字面上把一個鏈接放在input文本框中（儘管你可以用JavaScript來模擬一個鏈接）。

對於背景圖片，請使用CSS background-image。

來源

2011-08-05 16:32:08 Widor

你有兩個選擇。

將圖像放置爲輸入的背景，但這不會被點擊。
將元素絕對放在輸入上。

1：

.myInput { background:url(path/to/img.jpg) 5px 5px no-repeat; }

2：

HTML

<div class="inputContainer"> 
    <input class="myInput" type="text" name="myInput" id="myInput" /> 
    <a href="#" class="inputImg"><img src="#" /></a> 
</div>

CSS

.inputContainer { position:relative; } 
.myInput { padding-left:25px; /* This will move the text from under the image */ } 
.inputImg { left:5px; position:absolute; top:5px; z-index:5; }

你需要的位置和VALU玩這取決於你的輸入尺寸，圖像大小和一般位置，但應該做你想做的。

來源

2011-08-05 16:46:22 Seth

輸入標籤內的鏈接

回答

相關問題