元スレjQuery ライブラリ総合質問所 vol.4

みんなの評価 :

前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ

/ 要望・削除依頼は掲示板へ / 管理情報はtwitterで

901 = :

>>900
イベントの順番ではなくて、CSSの適用の方が速いので（正確にはブラウザによって違うと思うが）
フォーカスが外れたらすぐにレイアウトに反映される。CSSを使っている以上無理だろう。

だから全部JavaScriptに統一すればいい。

1. フォーカスイベントが発生した要素に適当なクラスをつける。
2. フォーカスアウトが発生した時にそのクラスを外す。
3. フォーカスアウトですぐにクラスを外して問題になるのなら、
setTmeoutを使って僅かに遅延させればいい。

jQueryを使わなくてもJavaScriptだけでできる。jQueryは
この処理を簡単に記述（おそらく10行以内）できるようにするだけ。

902 = :

>>901
ありがとうございます、よく分かりました！

903 = :

うーむ。やってみたけどこれだめだな。
遅延を大きくすれば可能だけど、少し遅延させただけだと
クリックイベントが発生しない。マシンスペックなどによるだろう。

これは他の要素がフォーカスを取った時に、
前にフォーカスがあった所（というか他全部）の
クラスを外したほうが良さそうだ。

想定外の所に飛んだ時とか考える必要があったら
面倒なことになりそうだな。

905 = :

あぁ、そうしたｗ

そうれで行けるならそっちのほうがいいよ。
別に他にやり方が無いわけじゃない。

クリックした時にクラスを外せばいい。
だけどクリック以外にもクラスを外すタイミングがあるだろう。
例えば他のinputとか。

本格的にやるやり方だと、意外と考える必要があって面倒。
手を抜いていいなら楽。画面構成によって変わるだろうから
これ以上やるなら、もう少し情報が必要だなぁと思った次第。

907 = :

いません！

908 = :

jquery ui のdraggableで長方形などはデモでありますが、
任意のアイコン画像をdrag移動させたいのですが、
画像の周囲は透明にした状態でできますか？
例えば●のマークのアイコンなら丸の黒い部分以外の周囲を透過にしたいのですが。

909 = :

アイコンを透過PNGにすればいいと思うよ！

910 = :

>>909
試してみたのですが、透過にならないんですよね。おかしいなあ。

911 = :

jQueryつーか、CSS初心者スレでレベルの内容だYO

912 = :

>>911
知らないならレスしなくていいよ

913 = :

>>910
うーんそれなら原因は分からないなあ。
再現ページのURLを貼ってくれれば答えられると思うよ！

914 = :

>>910
その画像どっかのロダにアップして

915 = :

>>912
あ？じゃあエスパーしてやるよ。
その画像の親要素の背景の色を解除すればいい。
ほらＣＳＳの内容だろ。

ローカル環境でそのpngだけを表示して透過しているなら間違いなくこのエスパーは当たりだ

916 = :

タグ以外の部分（本文）の全角と半角のスペースをjqueryで置き換えたいのですが、全角なら
$(this).html(txt.replace(/　/g,'●'));
で全角スペースが●に置き換わるのですが、半角だとタグ中のスペース（<a href...>のaとhの間のスペースなど）まで置き換えられてしまいます。
半角はどのようにしたら上手く変換できるでしょうか。

917 = :

>>916
正規表現でやればいいんじゃあないの？

919 = :

画面上のある<div>内の領域の(x,y)の座標（ピクセル値で）に、
十字のカーソルを描きたいのですが、最もお手軽な方法を教えて下さい。
何が起こってもその十字のカーソルは画面上に表示され続けるようにしたいです。
十字のカーソルデータは画像ファイルで与えたいです。

920 = :

何が起こってもって具体的にどういうこと？
停電しても表示させたいの？

921 = :

>>919
CSSの話なんでそっちで聞いてください

922 = :

>>921
お前は仕切り屋か

923 = :

>>922
はい。給料もらって仕切ってるプロですよ。

924 = :

>>920
はい。地震や災害にも強いカーソルを目指いしたいです。

925 = :

>>916
やってみたけどタグ内は置換されてなかったぞ。
気になるなら.text()でやったら？

$('a').each(function(){
var txt = $(this).text();
$(this).text(
txt.replace(/ /g,'●')
);
});

926 = :

jQueryUIのdraggableを使って、ごく普通に長方形なdivを配置した場合、
マウスのドラッグで移動できるのは良いのですが、そのdivの上でmousewheelを
回した時には、そのイベントは無視してその下にあるウインドウに投げたいのですが
どうやれば良いですか？

929 = :

つまり投げる側は２階以上の住居に住んでいるというのが条件になってくるな

930 = :

解決したらお礼ぐらい言ってほしいもんだ

932 = :

できれば縦読みで

934 = :

スクロールスクロールスクロールスクロールスクロールスクロール
スークーロールスークーロールスークーロールスークーロール
スクーロールスクーロールスクーロールスクーロールスクーロール
スクーロースクーロースクーロースクーロースクーロースクーロー

935 = :

>>934
アホですか？

936 = :

質問
.each()等で取得してきた値を1箇所にまとめて出力するのってどうやりますっけ？
↓hrefの値を取得し#hにテキストで出力したい

<div class="hoge">
<p><a href="#a">#a</a></p><span>hoge</span>
</div>
<div class="hoge">
<p><a href="#b">#b</a></p><span>hoge</span>
</div>

<p id="h"></p>

937 :

出力結果のイメージを書け

938 = 937 :

あと「どうやりますっけ？」じゃねえよアホ
知ってたけど忘れましたみたいな言い方すんな

939 = :

>>936
$("#h").html($("a").map(function() {
return this.href;
}).get().join("<br>"));

940 = :

>>938
すいませんすいませんすいません

>>939
うおすげ簡潔。
ありがとうございます！！！！！

941 = :

（jQueryプラグインを作る時以外）eachを使ったら負けだと思え

942 = :

>>941
それはなぜですか？
便利なのでよく使ってしまうんですが

944 = :

>>942
jQueryは、要素を一つづつ操作するライブラリではなく、
「CSSセレクタにマッチした0個以上の要素の塊」に対して操作するライブラリだから。
jQueryが関数型風ライブラリと言われる理由の一つでも有る。

eachを使うと要素を一つづつ操作することになる。
それはjQueryの本来の考え方に合っていない。

これはCSSの考え方にも適合している。
CSSはセレクタにマッチした要素に対して装飾を行うもの。
1つずつ操作をするという手続き型的なやり方はしない。

jQueryプラグインが例外なのは、そもそもプラグインというのは
素のJavaScriptを使ってjQuery風なメソッドを作るものだから仕方がない。

945 = :

>>944
なるほどjQueryの考え方からすると本筋ではないということですか
本筋から逸れたやり方をすることで
処理速度やコードの可読性が低下したりといった実害はありますか？

また、セレクタでピックアップした要素のひとつひとつに
操作を施したい場合、よりよい方法とはどんなものでしょう？

946 = :

> 処理速度やコードの可読性が低下したりといった実害はありますか？

「うおすげ簡潔」が答えだろう。jQueryのやり方だと簡潔になる。

> また、セレクタでピックアップした要素のひとつひとつに
> 操作を施したい場合、よりよい方法とはどんなものでしょう？
eachを使わない。

947 = :

実害はないということですか
それどころか簡潔な記述にできると

eachを使わない場合forループをまわすか
そもそもループを必要としない処理方法を考えるかですね
（上のmapの例のように）

しかし私の理解不足もあるのかもしれませんが
今後も気軽にeachを使いつづけてしまいそうな気がします・・・

948 = :

すみません、書き込んだあとに気が付きましたが
>>946を読み誤って逆の解釈をしてました

よろしければeachを使わない簡潔な記述の例を教えてください

949 = :

eachを使わなけれいいだけだろう。
例？

$('a').hide()

はい。おしまい

950 = :

俺も気にせずふつうに使ってるがダメなのか？
>>949は参考にならんし・・・