人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

jqueryでリンクのオン、オフの切替について質問させていただきます。

<div id="linklist">
<a href="hoge">hoge.com</a>
<a href="abcdefg">aaaaa.com</a>
<a href="123456">bbb.com</a>
<a href="iujga">cccc.com</a>
</div>
<div id="linkSwitch"><p>リンクオフ</p></div>


のような形で、linkSwitchを押した場合に一時的にa要素を無効にし、再度linkSwitchを押した場合に元に戻すようなことは可能でしょうか?

removeAttrでhrefを削除してしまうと元に戻せなく、方法を模索しております。。
現在は一旦オフにした場合、もう一度linkSwitchを押すとリロードするようなスマートではない形で実装をしています。。

$("#linkSwitch").toggle(
function(){
$("#linkSwitch p").text("リンクオン");
$("#linklist a").removeAttr("href");
},

function(){
$("#linkSwitch p").text("リンクオフ");
location.reload();}
});

どうぞよろしくお願いいたします。

※補足
・プログラミング歴4ヶ月目
・lamp+jquery
です。

●質問者: aiueo
●カテゴリ:インターネット ウェブ制作
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● Lhankor_Mhy
●40ポイント

いろいろ方法はありそうですが。

フラグを使う方法。

var f =true;
$('#linklist a').click(function(){return f;});
$('#linkSwitch').toggle(
 function(){f =false},
 function(){f =true}
)

2 ● a-kuma3
●60ポイント ベストアンサー

こちらは、イベントハンドラ自体を削除してしまう方法。

$("#linkSwitch").toggle(
 function(){
 $("#linkSwitch p").text("リンクオフ");
 $("#linklist a").click(function() {
 return false;
 });
 },
 function(){
 $("#linkSwitch p").text("リンクオン");
 $("#linklist a").unbind("click");
 }
 );

http://jsfiddle.net/Bdb8Z/ … jsFiddle で試してみました。


aiueoさんのコメント
ありがとうございます。こちらの形で実装することができました!
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ