アンカー要素の正常なアップグレード

Question

サムネイルの配列にJavaScript機能を追加して、カレントウィンドウで開くのではなくクリックすると画像が拡大されるようにしたいとします。私はonclick属性内の機能を有していると考えていますが、私はこの仕事を考えていない：

<script type='text/javascript'> 
function expand(){ 
    this.height = 200; 
    this.width = 200; 
} 
</script> 

<a href='/image_1.jpg' onclick='expand()'> 
<img src='/image_1.jpg'> 
</a> 

はJavaScriptが有効でない場合、私は仕事へのリンクをしたいと思います。どのようにこれを行うことについて行く考えですか？おかげであなたの時間:)

Answer 1

あなたが関数内で変数としてthisを与える必要があり、たとえばths

<script type='text/javascript'> 
function expand(ths){ 
    $(ths).find('img').height('200'); 
    $(ths).find('img').width('200'); 
    return false; 
} 
</script> 

<a href='/image_1.jpg' onclick='expand(this)'> 
<img src='/image_1.jpg'> 
</a> 

そしてreturn false Prusse氏は述べています。

** UPDATED ** あなたは画像のサイズを変更する場合は、画像やリンクなしを呼び出す必要があります。代わりに

：

Answer 2

だけonclickハンドラの戻りfalseを作ります。あなたの例のように、インラインハンドラの使用：

<a href='/image_1.jpg' onclick='expand(); return false;'> 

Answer 3

はonclickハンドラを使用しないでください

var elem = document.getElementById("the-id-of-a"); 
elem.addEventListener('click', function(e) { /* handle event */ e.preventDefault(); return false; }); 

参照：https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener