3

ユーザーが画像をクリックすると、その画像の src を URL として取得できる JavaScript を使用した関数を作成しようとしています。私はJavaScriptに非常に慣れていません。これまでのところ、画像の「onclick」によってアクティブ化される関数を作成する試みは次のとおりです。

var showsrc = function(imageurl)
var img = new Image();
img.src = imageurl
return img.src

結果を呼び出すには、image.srcをhtmlに挿入しようとしました

document.getElementById("x").innerHTML=imageurl;

私はほとんど成功していません。どんな助けでも大歓迎です。ありがとうございました。

4

4 に答える 4

3

これをIE9とChrome17でテストしました。本体（またはすべての画像の最も近いコンテナー）にonclickハンドラーを追加し、クリックされた要素が画像であるかどうかを監視します。その場合は、URLを表示してください。

http://jsfiddle.net/JbHdP/

var body = document.getElementsByTagName('body')[0];
body.onclick = function(e) {
    if (e.srcElement.tagName == 'IMG')    alert(e.srcElement.src);  
};​
于 2012-03-14T18:04:39.070 に答える
2

私はあなたがこのようなものが欲しいと思います：http：//jsfiddle.net/dLAkL/

ここのコードを参照してください：

HTML：

<div id="urldiv">KEINE URL</div>
<div>
    <img src="http://www.scstattegg.at/images/netz-auge.jpg" onclick="picurl(this);">
    <img src="http://www.pictokon.net/bilder/2007-06-g/sonnenhut-bestimmung-pflege-bilder.jpg.jpg" onclick="picurl(this);">
</div>​

JAVASCRIPT

picurl = function(imgtag) {
    document.getElementById("urldiv").innerHTML = imgtag.getAttribute("src");
}​
于 2012-03-14T18:05:11.223 に答える
0

画像タグはシングルトンタグであるため、「innerHTML」はありません。子を持つことはできません。xIDが画像タグ自体の場合、次のようになります。

 alert(document.getElementById('x').src);

画像のsrcを吐き出します。

于 2012-03-14T17:52:49.420 に答える
0

これは、javascript だけを使用した単純なソリューションです (おそらくクロスブラウザー互換性はありません)。

<!doctype html>
<html>
  <head>
    <script>
      function init() {
        var images = document.getElementsByTagName('img');

        for(var i = 0, len = images.length; i < len; i++) {
          images[i].addEventListener('click', showImageSrc);
        }
      }

      function showImageSrc(e) {
        alert(e.target.src);
      }
    </script>
  </head>
  <body onload="init()">
    <img src="http://placekitten.com/300/300">
  </body>
</html>
于 2012-03-14T17:59:15.950 に答える