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

jQueryに関する質問です。セレクタによるクラスの指定がうまくいきません。
解決方法をご教授ください。できれば、ソースをいただけるとありがたいです。
当方初級レベルです。

■実現したいこと
1.jQueryでclassを付加した要素を生成
2.そのclassをセレクタで指定し、クリックイベントを発生させる
※詳細はコメント欄のソースを参照してください

■問題
上記の2番がうまくいっていません。
1番はうまくいっているようです。
以下で配布されているブックマークレットで、
指定したい要素".test"を検索すると、期待通りの箇所がヒットします。
http://semooh.jp/jquery/ref/cont/selectors/

■問題が発生しているソース
表示されている文字列をクリックすることによって、
水平線の上と下で移動することを期待して書きました。
コメント欄に記載しましたが、インデントがつぶれてるかもしれません。お手数かけます。

●質問者: ぷりっぷりのおしり
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:Class jQuery test イベント クラス
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● ぱこち
●25ポイント
$(this).remove();
$(this).clone(true).appendTo(text);

この箇所で、要素をコピーする前に消しちゃっているようです。

順番を入れ替えてみたら、クリックするたびに上下に行ったり来たりするようになりました。

$(this).clone(true).appendTo(text);
$(this).remove();
◎質問者からの返答

お礼が遅くなって申し訳ありません。

回答ありがとうございました。

思った通りの挙動になりました。

また、何かあった際はよろしくお願いいたします。


2 ● y-kawaz
●40ポイント ベストアンサー

問題となっているのは多分cloneをappendしている点で、cloneで作られた要素は属性やタグの中身はコピーされますがイベントはコピーされない為、コピーされた要素ではclickで何も起きないんだと思います。

これを解決するにはクリックイベントとの登録に click 関数を使うのではなく、live関数を使うのが簡単で良いでしょう。

clickイベントの登録箇所を以下のように修正してみてください。

$(".test").live("click",
function(){});
◎質問者からの返答

お礼が遅くなって申し訳ありません。

回答ありがとうございました。

思った通りの挙動になりました。

イベントのコピーについての知識がなかったので調べてみたいと思います。

また何かあった際はよろしくお願いいたします。


3 ● Cherenkov
●25ポイント

removeとcloneしている行を逆にすれば希望の動作になるかな。

ただ上下させるだけなら毎回生成しなくてもいいのでは。

$(function () {
 $(".test").click(function(){
 var self = $(this);
 (self.parent().attr('id') == "first") ? self.appendTo('#second') : self.appendTo('#first');
 });
});
◎質問者からの返答

お礼が遅くなって申し訳ありません。

回答ありがとうございました。

思った通りの挙動になりました。

また、何かあった際はよろしくお願いいたします。

関連質問


●質問をもっと探す●



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