2

私は独学で CSS HTML を学んでおり、現在は Javascript を学んでいます。

私のこの小さなプロジェクトの背後にあるアイデアは、ユーザーに img の URL を入力させることです。ユーザーがボタンを押すと、img が<div>ページ内の新しいものに挿入されます。

私はstackoverflowで何時間も探してみましたが、正直なところ、自分のコードに対して他の回答を使用する方法がわかりません. CSS と HTML コードのほとんどは既に作成されています。可能であれば、javascript の部分に関するヘルプが必要です。

これが私がこれまでに持っているものです:(申し訳ありませんが、それほど多くはありません)

html コード:

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

Javascript コード:

<script type="text/javascript">

function GetFeed(imgForm){

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


}
</script>

誰でも私を助けることができますか?ここからどこへ行くべきかわかりません..少なくとも、txtボックスから値を取得し <div><img src="user input from txt box should go here"/></div>、unserが挿入するたびに新しいURLとimgの新しいURLを追加する方法をいくつか教えてください。

ありがとうございます。

4

4 に答える 4

1

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>あなたの必要に応じて、これが必要だと思います

HTML

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

JS (head タグの中に入る)

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;
}

ここにがあります。</p>

于 2012-03-27T00:13:09.347 に答える
0

idに属性を追加する必要があります<input>:

<input type="text" name="inputbox1" id="box1" value="src" /> 

...次に、コードを調整します。

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

ソースを取得したら、imgタグのオブジェクトを取得し、テキスト ボックスの値を使用してそのプロパティを設定できます。imgオブジェクトのプロパティは、ドキュメント オブジェクト モデルによって定義されます。

http://www.w3schools.com/jsref/dom_obj_image.asp

于 2012-03-27T00:01:20.223 に答える
0

このようなものは、入力ボックス内のテキストと等しい src を持つ画像要素を持つ div を作成します。次に、div をページの最後に追加します。

<html>
    <head>
        <script type="text/javascript">
            function GetFeed(form){
            var imgSrc = form.elements["inputbox1"].value;  
            var imgDiv = document.createElement('div');
            imgDiv.innerHTML = "<img src=\"" + imgSrc + "\"/>"
            document.body.appendChild(imgDiv);
            }
        </script>
    </head>
    <body>
        <form name="imgForm">
            enter URL:
            <input type="text" name="inputbox1" value="src" />  
            <input type="button" value="Get Feed" onclick="GetFeed(this.form)"/>
        </form>
    </body>
</html>
于 2012-03-27T00:14:08.780 に答える