从输入框获取img src到div [英] Get img src from input box into a div

问题描述

我自学CSS HTML和现在的Javascript。

I'm self teaching myself CSS HTML and now Javascript.

我的这个小项目背后的想法是让用户输入img的URL，当用户点击按钮时，img应该插入到新的页面内的< div> 。

The idea behind this small project of mine is to have an user enter an URL for an img, when the user hits a button the img should then be inserted into a new <div> within the page.

我试过在stackoverflow上寻找好几个小时，但老实说我不明白我如何使用我自己的代码的其他答案。大多数CSS和HTML代码已经完成，我只需要帮助javascript部分，如果可能的话。

I tried looking for hours at stackoverflow but i honestly don't understand how i can use other answers to my own code. most of the CSS and HTML code is already done, i just need help with the javascript part if its possible at all.

这是我到目前为止:(抱歉）它并不多）

here is what i have so far: (sorry it's not much)

html代码：

<form name="imgForm">
enter URL:
<input type="text" name="inputbox1" value="src" />  
<input type="button" value="Get Feed" onclick="GetFeed()"/>
</form>

Javascript代码：

Javascript code:

<script type="text/javascript">

function GetFeed(imgForm){

var imgSrc = document.getElementById('src').value;    


}
</script>

任何人都可以帮助我吗？我不知道从哪里开始..至少给我一些指示我如何从txt框中获取值并添加新的
< div>< img src =用户输入来自txt框应该在这里/>< / div> 每次为img插入一个unser？和新URL？

can anyone help me out? I dont know where to go from here.. at least give me some pointers how can i get the value from the txt box and add a new <div><img src="user input from txt box should go here"/></div> for every time an unser inserts and new URL for an img?

谢谢高级。

推荐答案

我认为根据您的需要我如何从中获取价值txt框并添加一个新的< div>< img src =用户输入来自txt框应该到这里/>< / div> 你需要这个

I think according to your need how can i get the value from the txt box and add a new <div><img src="user input from txt box should go here"/></div> you need this

HTML

<form>
  <input type="text" id="txt">
  <input id="btn" type="button" value="Get Image" onclick="getImg();" />
</form>
<div id="images"></div>

JS （进入你的头部标签）

JS (goes inside your head tags)

function getImg(){
    var url=document.getElementById('txt').value;
    var div=document.createElement('div');
    var img=document.createElement('img');
    img.src=url;
    div.appendChild(img);
    document.getElementById('images').appendChild(div);
    return false;
}

这是示例。

这篇关于从输入框获取img src到div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！