jsをaタグのonClickにスマートに書く方法は?

<a href="javascript:void(0)" onClick="aaaa();return false">あああああ</a>
と書いているのですが、もっとスマートに書けないものでしょうか?
jQueryを使っています。

回答の条件
  • 1人2回まで
  • 登録:
  • 終了:2010/03/13 22:55:03
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

回答4件)

id:Km1967 No.1

回答回数224ベストアンサー獲得回数35

ポイント27pt

anchorタグを使う限りは無理でしょうね。

buttonにするとかspanにするなどの代替措置を取るくらいでしょう。

SEO的にはanchorのほうがいいかもしれませんけど、

スクリプトに飛ばす時点でどうかと思いますし好みの問題でしょうね。

buttonだと基本的にはformが必要になってしまうので

spanにclassつけといてanchorみたいなstyleに整えれば良いでしょう。

<span class="anchor" onClick="aaaa();">あああああ</span>

URLは適当です。

http://copicopi.com/onclickfont.html

http://www.red.oit-net.jp/tatsuya/java/button.htm

id:dingding

なるほど。やはりそうですか。見た目がリンクでないならそれもありですね。リンクならそれっぽくわざわざするのはナンセンスかなと思いますので、今のままでいきます。

ちなみにaタグでhrefを無しにしたら行けるのでは、と思いましたが、hrefがないとリンクにならないんですね。

2010/03/06 23:47:42
id:Cherenkov No.2

回答回数1504ベストアンサー獲得回数493

ポイント27pt

clickイベントをbindしてpreventDefault()でページ遷移させないサンプル。

http://jsfiddle.net/afV8J/


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(function(){
  $('#hoge').click(function(e){
    e.preventDefault();
    alert("iiiiii");
  });
});
</script>
</head>
<body>
<a href="" id="hoge">あああああ</a>
</body>
</html>
id:dingding

ありがとうございます。こういう手もあるんですね。

2010/03/07 01:45:40
id:kebo987654 No.3

回答回数38ベストアンサー獲得回数10

ポイント27pt

onclick=""に書いていることをhrefの中に入れてみる。なんてのはどうですか?

<a href="javascript:alert( 'href' );void( 0 );">あいうえお!!!</a>
                                    ~~~~~~~~~

void( 0 );はundefinedを返すために必要ですので注意してください。

undefined以外を返すと、

<a href="javascript:null;">あいうえお!!!</a>
                    ~~~~

このサンプルでは真っ白のページに「null」と表示されてしまいます。

id:dingding

なるほど、これで動作すればそれもありですね。

2010/03/07 16:03:38
id:a532 No.4

回答回数31ベストアンサー獲得回数2

ポイント9pt

ジャンプしないのだから、

<style type="text/css"></p> <p><!--</p> <p>a{</p> <p>color:#0000ff;</p> <p>text-decoration:underline;</p> <p>cursor:pointer;</p> <p>}</p> <p>a:hover{</p> <p>color:#ff0000;</p> <p>}</p> <p>a:active{</p> <p>color:#000000;</p> <p>}</p> <p>--></p> <p></style>

</head>

<body>

あああああ


こういうことではないのでしょうか。

hover等はこちらで適当に装飾しました。

id:dingding

装飾の仕方はわかっていますが、余計に面倒になるので意味がないなと。

2010/03/07 16:04:41
  • id:Cherenkov
    clickイベントをbindするのはダメでonclickを使わないといけないんですか?
  • id:Km1967
    id:Cherenkov さん
    jQuery使ってるのをすっかり忘れて回答してました。
    回答欄のほうになさっては?
  • id:dingding
    >clickイベントをbindするのはダメでonclickを使わないといけないんですか?
    そんなことはありません。onClickでなくても同じような動作になれば構いません。

    Cherenkovさん、Km1967さん、よければ回答欄に投稿をお願いします。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません