Question

这是显示我的要求的图像

我这样写我的代码。 html：

<input type="search" id="linkit">
<a href="" id="hp" onclick="searchit()">clickme</a>

javascript：

function searchit() {
   document.getElementById('hp').href=(("https://www.google.com/search?q=") + (document.getElementById("linkit");

它的工作，但在另一个窗口中获取给定的图像URL页面，但我也希望结果在同一页面中。

Answer 1

<img id="result" />

function searchit() {
    document.getElementById('result').src = (("http://via.placeholder.com/350x") + (document.getElementById("linkit").value))};

你好，

您的问题是您试图创建链接，而不是显示图像。您应该改为更改图像的src。在上面的代码中，我添加了一个图像来保存查询的结果，并使用输入的值更新图像的src部分。这样，得到想要的结果。

Answer 2

<!DOCTYPE html>
<html>
<body>

<input type="search" id="linkit">

<button onclick="searchPic()">Search Image</button>
<div>
<img id="myImage" src="" style="width:100px">
</div>


<script>
function searchPic()
{
	searchValue= document.getElementById('linkit').value;
    alert(searchValue);
	document.getElementById('myImage').src = searchValue;
}
</script>

</body>
</html>

复制并粘贴下面提供的任何图片网址或任何有效的图片网址进行测试

我想要一个带有按钮的搜索框，可以在其中复制任何图像URL，并且希望该图像显示在同一网页上

2 个答案: