jQuery で ul>li をクリックしたら、liの全角文字をエンコードして、a要素のパラメータとしてセットしたいのですができますか?

訳あって、コメント行の『ここで●●にstrをセットする?』で行いたいのですが可能でしょうか?
よろしくお願いします。

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2013/10/19 17:54:58
  • 終了:2013/10/20 10:34:15
id:appfb

質問者から

appfb2013/10/19 18:03:40
<!DOCTYPE html>
<html lang="ja">
<head>
	<script src="js/jquery-1.9.1.min.js"></script>
	<script>
	var select_id = 0;
//--- ラジオボタン
	function qSelectFunc(){
		if(select_id == this.id) return;
		$(this).addClass("selected");
		$("#" + select_id).removeClass("selected");
		select_id = this.id;
		var str = $("#" + select_id).text();
		// ここで●●にstrをセットする?
	}
	$(function(){
		$("ul>li").on("click", qSelectFunc);
/	});
	</script>
</head>

<body>
	<ul>
	<li id="1">あああ</li>
	<li id="2">いいい</li>
	<li id="3">ううう</li>
	</ul>

	<div class="violationLink"><a href="<{$app_violation_url}>?fbid=<{$fbid}>&str=●●" target="_self">リンク</a></div>
</body>
</html>

ベストアンサー

id:Cherenkov No.1

Cherenkov回答回数1502ベストアンサー獲得回数4922013/10/19 18:19:55

ポイント100pt

こういうのはどうでしょう。ベースのURLを変数に持っている。

<!DOCTYPE html>
<html lang="ja">
<head>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script>
	var baseUrl = '<{$app_violation_url}>?fbid=<{$fbid}>';
	var select_id = 0;
//--- ラジオボタン
	function qSelectFunc(){
		if(select_id == this.id) return;
		$(this).addClass("selected");
		$("#" + select_id).removeClass("selected");
		select_id = this.id;

		// ここで●●にstrをセットする?
		var str = encodeURIComponent($(this).text());
		var url = baseUrl + '&str=' + str;
		var violationLink = $('.violationLink a');
		violationLink.attr('href', url);

	}
	$(function(){
		$("ul>li").on("click", qSelectFunc);
	});
	</script>
</head>

<body>
	<ul>
	<li id="1">あああ</li>
	<li id="2">いいい</li>
	<li id="3">ううう</li>
	</ul>

	<div class="violationLink"><a href="<{$app_violation_url}>?fbid=<{$fbid}>" target="_self">リンク</a></div>
</body>
</html>


もしくはリンクURLの &str= から & までの範囲を置換するタイプ。

<!DOCTYPE html>
<html lang="ja">
<head>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script>
	var select_id = 0;
//--- ラジオボタン
	function qSelectFunc(){
		if(select_id == this.id) return;
		$(this).addClass("selected");
		$("#" + select_id).removeClass("selected");
		select_id = this.id;

		// ここで●●にstrをセットする?
		var str = encodeURIComponent($(this).text());
		var violationLink = $('.violationLink a');
		violationLink.attr('href', violationLink.attr('href').replace(/&str=[^&]*/, '&str=' + str));

	}
	$(function(){
		$("ul>li").on("click", qSelectFunc);
	});
	</script>
</head>

<body>
	<ul>
	<li id="1">あああ</li>
	<li id="2">いいい</li>
	<li id="3">ううう</li>
	</ul>

	<div class="violationLink"><a href="<{$app_violation_url}>?fbid=<{$fbid}>&str=●●" target="_self">リンク</a></div>
</body>
</html>
他1件のコメントを見る
id:Cherenkov

回答を更新しました

2013/10/19 18:29:37
id:appfb

ご回答ありがとうございます。
返信が遅くなり失礼しました。

2案どちらも希望通り動作を確認いたしました。
ありがとうございます!
『 &str= から & までの範囲を置換するタイプ』で行こうと思います。
ありがとうございました。

2013/10/20 10:33:47

その他の回答(0件)

id:Cherenkov No.1

Cherenkov回答回数1502ベストアンサー獲得回数4922013/10/19 18:19:55ここでベストアンサー

ポイント100pt

こういうのはどうでしょう。ベースのURLを変数に持っている。

<!DOCTYPE html>
<html lang="ja">
<head>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script>
	var baseUrl = '<{$app_violation_url}>?fbid=<{$fbid}>';
	var select_id = 0;
//--- ラジオボタン
	function qSelectFunc(){
		if(select_id == this.id) return;
		$(this).addClass("selected");
		$("#" + select_id).removeClass("selected");
		select_id = this.id;

		// ここで●●にstrをセットする?
		var str = encodeURIComponent($(this).text());
		var url = baseUrl + '&str=' + str;
		var violationLink = $('.violationLink a');
		violationLink.attr('href', url);

	}
	$(function(){
		$("ul>li").on("click", qSelectFunc);
	});
	</script>
</head>

<body>
	<ul>
	<li id="1">あああ</li>
	<li id="2">いいい</li>
	<li id="3">ううう</li>
	</ul>

	<div class="violationLink"><a href="<{$app_violation_url}>?fbid=<{$fbid}>" target="_self">リンク</a></div>
</body>
</html>


もしくはリンクURLの &str= から & までの範囲を置換するタイプ。

<!DOCTYPE html>
<html lang="ja">
<head>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script>
	var select_id = 0;
//--- ラジオボタン
	function qSelectFunc(){
		if(select_id == this.id) return;
		$(this).addClass("selected");
		$("#" + select_id).removeClass("selected");
		select_id = this.id;

		// ここで●●にstrをセットする?
		var str = encodeURIComponent($(this).text());
		var violationLink = $('.violationLink a');
		violationLink.attr('href', violationLink.attr('href').replace(/&str=[^&]*/, '&str=' + str));

	}
	$(function(){
		$("ul>li").on("click", qSelectFunc);
	});
	</script>
</head>

<body>
	<ul>
	<li id="1">あああ</li>
	<li id="2">いいい</li>
	<li id="3">ううう</li>
	</ul>

	<div class="violationLink"><a href="<{$app_violation_url}>?fbid=<{$fbid}>&str=●●" target="_self">リンク</a></div>
</body>
</html>
他1件のコメントを見る
id:Cherenkov

回答を更新しました

2013/10/19 18:29:37
id:appfb

ご回答ありがとうございます。
返信が遅くなり失礼しました。

2案どちらも希望通り動作を確認いたしました。
ありがとうございます!
『 &str= から & までの範囲を置換するタイプ』で行こうと思います。
ありがとうございました。

2013/10/20 10:33:47

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

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

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

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

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