2016-08-08 9 views
0

イメージを変更するためにonclick関数を使用した後、イメージにハイパーリンクを追加しようとしています。 onclickイメージの変更は機能しますが、変更されたイメージへのリンクを追加するのは苦労します。onclickイメージの変更後に新しいイメージにハイパーリンクを追加

<div class="masonary16 ms mblogvid"><img id="ms16" src="Images/img1.jpg" 
height="100%" onclick="overimg(); imglink();"/></div> 



function overimg() { 
document.getElementById("ms16").src = "Images/OVER/img2.jpg"; 
} 

function imglink() {  
var parentEl = document.getElementById("ms16").parent; 
var imgEl = parentEl.innerHtml; 
parentEl.innerHtml = '<a href="http://www.google.com">' + imgEl + '</a>';} 

ご回答いただきありがとうございます。

+0

をCLASSLISTことにより、クラス名を取得するので、1つのクラスを取るとhtmlをつかむことができますあなたは何を「imglink」関数でやろうとしていますか? – jonju

+0

新しい画像へのリンクを追加しようとしています。 –

+0

あなたはハイパーリンクを意味しますか? – jonju

答えて

0

<a>を作成し、そのリンク(URL)を設定してappendChild()メソッドを使用して画像をラップし、divの内部にラップします。

<div class="masonary16 ms mblogvid"> 
    <img id="ms16" src="Images/scoge-menswear-16.jpg" height="100%" onclick="overimg(); imglink(this);"/> 
</div> 



function imglink(img) { 
    var link = document.createElement('a'); 
    link.setAttribute('href','url'); 
    var parentEl = document.getElementById("ms16").parentElement; 
    link.appendChild(img); 
    parentEl.appendChild(link); 
} 
+0

それはうまくいった。ありがとう、あなたは命の恩人です! –

0

hrefとして親divを試してください。私はあなたが問題を解決できると思います。ここに私のオプションは

<a href="" class="masonary16 ms mblogvid"> 
<img id="ms16" src="Images/scoge-menswear-16.jpg" height="100%"onclick="overimg(); imglink();"/> 
</a> 

function imglink() {  
    var parentEl = document.getElementById("ms16").parent; 
    parentEl.href="xyz.php"; 
    return false;; 
} 
0

であることはparentElementparentありませんが、この機能は私が.innerHTMLで作業していないthink.Soのみ表示htmlができます。しかし、我々は...仕事かもしれない

function imglink() { 
var parentEl = document.getElementById("ms16").parentElement; 
var imgEl = document.getElementsByClassName(parentEl.classList[0]); 
imgEl[0].innerHTML = '<a href="http://www.google.com">'+imgEl[0].innerHTML+'</a>'; 
} 
関連する問題