ベストセラー人気 WordPress テーマTop 30 詳細

全体Divをクリックできるように作成 - jQueryの例

Last Updated:2020年11月15日| コメントを残す
  • Naver ブログを共有する
  • Naver バンドに共有する
  • Facebook 共有する
  • Twitter 共有する
  • 카카오스토리공유하기

例えば、次のような状況でDiv全体をクリック可能にしてクリックすると、指定されたURLに移動するように必要がある場合があります。

<div class="clickable" url="http://google.com">
내용
</div>

この場合は、次のようなjQueryのスクリプトを使用することができます。

$("div.clickable").click(
function()
{
window.location = $(this).attr("url");
return false;
});
// Source: http://stackoverflow.com

ここで falseを返すイベントバブル(event bubbling)を防止するためのものだそうです、 falseを返す 代わりに event.preventDefault()を奨励する方もいますね。 event.preventDefault()falseを返す 比較は ここを参考にしてみてください。 さまざまなユーザーの意見を確認してみることができます。

直接jQueryスクリプト内でリンクを指定してやろうという場合には、次のようなコードが可能です。

jQuery('.clickable).click(function(){
window.location = 'http://www.google.com';
});


コメントを残す

コメント