javascript - 通过单击图像将文本插入输入字段

Question

我正在寻找一种“浏览和插入图像”效果，将图像 URL(所有图像信息都保存在数据库中)放入输入字段以供提交。

有点像在 WordPress 中，您可以单击浏览，选择图像，然后在单击确定后，它会在文本区域中显示图像，或在输入框中显示 url。

我不太确定要搜索什么来了解如何执行此操作。我是 javascript/jquery 的新手。感谢您的帮助!

Answer 1

根据请求，这将起作用:

HTML

<input type="text" id="imgsrc" style="width:500px"/>
<div>
  <img src="https://placeimg.com/100/100/any"/>
</div>
<div>
  <img src="https://placeimg.com/100/100/arch"/>
</div>
<div>
  <img src="https://placeimg.com/100/100/tech"/>
</div>

jQuery

$('img').on('click', function() {
    $('#imgsrc').val( $(this).attr('src') )
})

Fiddle Example