jQueryで以下を実現するにのどう書けばいいでしょう?


<a href="xxxxx" class="abc" alt="あいうえお">かかかか</a>

このリンクの後ろにこのリンクの情報から取得した情報を使ったonClickのリンクを付ける
URL、altの値を関数の引数にする

ベタで書いた以下と同じようにする
<a href="xxxxx" class="abc" alt="あいうえお">かかかか</a><div onClick="xyz('xxxxx','あいうえお');">★</div>
後ろにつくリンクはaタグでも何でもいいですが、onClickできるものでお願いします。

回答の条件
  • 1人2回まで
  • 登録:2010/03/06 00:51:36
  • 終了:2010/03/06 08:59:32

ベストアンサー

id:Cherenkov No.3

Cherenkov回答回数1502ベストアンサー獲得回数4922010/03/06 03:37:45

ポイント48pt

回答1の$(this)では値が取得できないような。

サンプル。

http://jsfiddle.net/mRETQ/

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(function(){
  //一個ずつ
  //$("a.abc").after("<div onClick=xyz('" + $("a.abc").attr("href") + "','" + $("a.abc").attr("alt") + "');>★</div>");

  // aタグでclass="abc"な要素すべてに行う
  $.each($("a.abc"), function(){
    var self = $(this);
    self.after("<div onClick=xyz('" + self.attr("href") + "','" + self.attr('alt') + "');>★</div>");
  });
});

function xyz(a, b) {
  alert([a,b]);
}

</script>
</head>
<body>
<a href="xxxxx1" class="abc"  alt="あいうえお1">かかかか1</a>
<a href="xxxxx2" class="abc"  alt="あいうえお2">かかかか2</a>
<a href="xxxxx3" class="abc"  alt="あいうえお3">かかかか3</a>
<a href="xxxxx4" class="abc"  alt="あいうえお4">かかかか4</a>
<a href="xxxxx5" class="abc"  alt="あいうえお5">かかかか5</a>
</body>
</html>
id:dingding

ありがとうございます!

ちょうどthisが効かないことで困っていました!

できました!!!

2010/03/06 08:59:11

その他の回答(2件)

id:Km1967 No.1

Km1967回答回数224ベストアンサー獲得回数352010/03/06 01:27:35

ポイント32pt
$(document).ready(function(){
    $("a").after("<div onClick="xyz('" + $(this).attr('href') + "','" + $(this).attr('alt') + "');">★</div>");
});

http://semooh.jp/jquery/

id:dingding

ありがとうございます!こんな感じにできるんですね。試してみます。

2010/03/06 01:50:44
id:vbvbvbvbvb No.2

vbvbvbvbvb回答回数16ベストアンサー獲得回数02010/03/06 01:53:04

え?ふつうに、リンクですればいいんんじゃないんですか?

id:Cherenkov No.3

Cherenkov回答回数1502ベストアンサー獲得回数4922010/03/06 03:37:45ここでベストアンサー

ポイント48pt

回答1の$(this)では値が取得できないような。

サンプル。

http://jsfiddle.net/mRETQ/

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(function(){
  //一個ずつ
  //$("a.abc").after("<div onClick=xyz('" + $("a.abc").attr("href") + "','" + $("a.abc").attr("alt") + "');>★</div>");

  // aタグでclass="abc"な要素すべてに行う
  $.each($("a.abc"), function(){
    var self = $(this);
    self.after("<div onClick=xyz('" + self.attr("href") + "','" + self.attr('alt') + "');>★</div>");
  });
});

function xyz(a, b) {
  alert([a,b]);
}

</script>
</head>
<body>
<a href="xxxxx1" class="abc"  alt="あいうえお1">かかかか1</a>
<a href="xxxxx2" class="abc"  alt="あいうえお2">かかかか2</a>
<a href="xxxxx3" class="abc"  alt="あいうえお3">かかかか3</a>
<a href="xxxxx4" class="abc"  alt="あいうえお4">かかかか4</a>
<a href="xxxxx5" class="abc"  alt="あいうえお5">かかかか5</a>
</body>
</html>
id:dingding

ありがとうございます!

ちょうどthisが効かないことで困っていました!

できました!!!

2010/03/06 08:59:11

コメントはまだありません

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

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

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

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません