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

JavaScript覧 / PC版 /

みんなの評価 :

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

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

251 = :

>>120も同一か
>>185-186も自演くさい

252 = :

; (function ($) {
　$.fn.aaa = function (args) {
　args = args || {};
　　　return this.each(function () {
　　　　function bbb(n) {
　　　　// 省略
　　　　}
　　　});
　　};
})(jQuery);
jQueryもJavaScriptも初心者なのですが、こういうのか書かれている file.jsが有ったとして、
この中のbbbという関数を別のJavaScriptから呼び出すことはできますか？
やり方を教えてください。 ; ($) $.fn. || {} (jQuery) など、何の事かさっぱりわかりません。

253 = :

>>252
それはjQueryは関係ない話だね。

関数の中にある関数は基本的に外からはよべないよ。

ソースがあるんだからリファクタして
他から使えるようにすればいいだけだと思うけど。
ライセンスに気をつけて。

254 = :

>>253
解説ありがとうございました。
よく理解できました。感謝です。

255 = :

ネットで見つけたjQuery1.3ライブラリを使うサンプルプログラムを試したら
スイスイ動いたのですが、jQuery1.9や1.10などの新しいライブラリで
動かすと、動きがカクカクして反応が悪いのですが、こういう場合何が
原因でしょうか？

256 = :

>>255
それはどれかね？
内緒にするようなことじゃないんだから
そのサンプルプログラムを晒したほうが早い

257 = :

>>248をお願いします。

特に呼び名は無いということでしょうか？
仮想タグみたいな

258 = :

>>257
ない

259 = :

動的な要素とかじゃ？

260 = :

動的要素か。ふむふむなるほど

263 :

縦に複数画像配置してスクロール時に現在位置の画像から3枚目程度先の画像までを先読みさせるのはどうやるのでしょうか

264 = :

要らない工夫の代表例だな。
だから非力なスマホではJSオフにかぎる。

266 = :

//　#id_nameに関する各種の属性を沢山取得したい場合、
var t = $('#id_name').css('top');
var b = $('#id_name').css('bottom');
var l = $('#id_name').css('left');
var r = $('#id_name').css('right');
//　これよりも、
var id = $('#id_name');　　//　変数に代入しておいて
var t = id.css('top');
var b = id.css('bottom');
var l = id.css('left');
var r = id.css('right');
//　とやるほうが速かったりしますか？

267 = :

そうですね。

268 = :

>>267
有り難うございました。

269 = :

すみません、jQuery.ui.datepickerで？dateFormatがyymm
（例：201403）の場合に、その日付のカレンダーが
表示されないのですが、どうしたら良いでしょうか？
いい方法がないなら、DBから取得した日付文字列の末尾に
01を
くっつけてyymmddにしてクライアントに渡そうと思います。

270 = :

用意された方法はない、ということでしょうか。
ありがとうございました。
↓のライブラリを使ってみます。

jquery.ui.datepicker.jsに最小限の手を加えて年月選択UIを作る at softelメモ:
http://www.softel.co.jp/blogs/tech/archives/4297

271 = :

このライブラリも yymdd のように d を含まないと
カレンダーにその年月のが表示されないんですね。
これはバグかな。弱った…。

272 = :

オーバーライドじゃなくて書き換えるのかw
Perl4時代のCGIスクリプトか？w
なんかもうそんなクソライブラリコードなんて見るのも使うのも嫌だなw
そもそもそんな機能は無くても困らないからわざわざJSで実現してクロームに合わせなくていいよと思う。

273 = :

var data = $('#id').css('border-left-color');
で
data = "rgba(82, 36, 36, 1)"
が得られたとして、これを
data = "rgba(82, 36, 36, 0)"
に変更したいのですが、正統的な手法はありますか？

274 = :

透明度を1から0にするならopacity使ったほうが楽だと思う

277 = :

単純にボーダースタイルをnoneにしたらダメなん？

278 = :

>>277
border幅が10pxだとすると、
noneにすると、borderの幅が無いことになるんじゃないですか？
そすると左に10pxずれてしまいます。そうではなくて、
透明なborderを10px描きたいのです。

279 = :

CSSだけでは無理だと思う。
それに計算済みスタイルはこちら側が設定した値を好き勝手に変えてくるので、
取得ではあまり期待しないほうがいい。

目的は分からないけど、単にrgbのデータを保存したいだけなら、配列とかを使ってJS側で保管したほうがいいかと

280 = :

>>278
マージンの値を取得
それにボーダーの太さを足す
マージンを上で出た値に変更

281 = :

Firefox は DOM-Level-2-Style に追加で alpha という名前のプロパティが独自に実装されているから読み取れる。
getComputedStyle(document.getElementById('id'), '').getPropertyCSSValue('border-left-color').getRGBColorValue().alpha.cssText
こんな風にして(例えば .red.cssText)取得して使う。
もともとsetRGBColorValueみたいなメソッドは定義されていないし独自実装も無いから諦めてまとめて指定するしかない。

特記すべき注意点として、setPropertyで2番目の引数を0にして透明にすると以降の変更が不可能になるバグがある。
これは凡そ0.002以上1以下の値に収める事で回避できる。

282 = :

jQueryって
$(#id)のように#が必要ですが
これはなぜですか?JSでは#不要だからよく混乱します。

283 = :

>>282
> これはなぜですか?JSでは#不要だからよく混乱します
JavaScriptじゃなくて、DOM APIですね。

DOM APIは#が不要な代わりに、
id専用のgetElementById
class専用のgetElementsByClassName
タグ専用のgetElementsByTagName
name専用のgetElementsByName
と言う風に冗長な名前で幾つもの関数が必要になってしまいました。
しかも、タグ＋クラスとい指定はできないですしね。

所でCSSというのは知っていますか？
HTMLで要素をデザインする時に使うもので、
#id { color: red } とか
.class { color: blue } とか
出来ます。

しかも組み合わせて
#id.class[name="hoge"] + span { color: green } とか
できちゃうんですね。強力です。これをCSSセレクタといいます。

CSSはHTMLと一緒でウェブプログラマにとって必須知識で
初心者以外だれでも知っていると言っても過言ではありません。

jQueryが画期的だったのは、だれでも知っているCSSセレクタを使えるようにしたところです。
これにより、冗長な名前で幾つ必要で柔軟性がないものを
たった一つの関数 $(CSSセレクタ)で実現してしまったわけです。

それから数年後、jQueryにインスパイアされて
DOM APIにもquerySelectorAllというCSSセレクタが使える関数が追加されました。
冗長な名前という問題はしませんでしたが。だから「JSでも#は必要」とも言えますｗ

284 = :

あ、CSSセレクタというのは、
「#id.class[name="hoge"] + span」の部分のことですよ。

当然、 $('#id.class[name="hoge"] + span') という書き方も出来ます。

これはDOM APIではquerySelectorAllが登場するまで出来なかったことです。
querySelectorAllはIE8以降で対応です。
jQueryはIE6の時代からありますね。

285 = :

>>282
詳しい解説有難うございました。
CSSは現在勉強中ですが、282さんの解説は要点が良くまとまっているので
大変参考になりました。
>#id.class[name="hoge"] + span { color: green } とか
>できちゃうんですね。
こんな書き方は知らなかったです。
奥が深いですね。

286 = :

http://jsfiddle.net/496c9/
このサンプルで質問なのですが、
選択したボタンの背景色を黒っぽくしているのは、以下のCSSの部分だと思うのですが、

#donate input:checked + span {
background-color:#404040;
color:#F7F7F7;
}

これをCSSファイルではなくて、jQueryで
$'( ).css( );
みたいな命令を実行する方法で実現できますか？
要するにCSSファイルを使わずにこのサンプルを実行する方法があるのかどうか知りたいのです。

287 = :

$().css() だと要素に直接 style="" で指定するから無理ぽ。
<style>を直接追加するべし。
$("<style>").text("#donate input:checked + span { background-color:#404040; color:#F7F7F7; }").appendTo("head");

288 = :

>>287
なるほど。ありがとうございました。

289 = :

>>286
念の為に言っておくけど、そういう見た目を変えることは
CSSを使ってやるのが正しい回答。
JavaScript（jQuery）を使わずにできるのはCSSでやる。
そのサンプルはちゃんとできてる。

>>287でもいいけど、

1. JavaScriptファイルを使うならば、そのファイルを読み込む所があるはず
ならば、document.write("<style>～</style>") で吐き出したほうがいい。

2. JavaScriptファイルすら使わないならHTMLに直接<style>～</style>を書けばいい

290 = :

<img id="a" src="hoge.jpg">のhoge部分を適当な文字列を一旦入れておいて
.attr（）で書き換える場合、
firefoxでは一旦hoge.jpgとしてｓｒｃを読み込もうとして、ファイルが見つからず、エラーになり、表示速度に影響を及ぼしているようです。
※表示は意図したとおり（jQueryで）になります。
一般的にはどうするべきでしょうか？（hoge.jpgという画像を実際にサーバーにUPしておけばいいのかもしれませんが）

291 = :

src="hoge.jpg" 書かなければいいんじゃないの？

292 = :

>>291
なるほど。
文法的にはNGそうだが・・。

293 = :

img タグを動的に作るとか

294 = :

透明なダミーイメージを指定しとくとか

295 = :

>>293
それだなｗ

>>294
最悪それも考えてた

296 = :

>>290
> 一般的にはどうするべきでしょうか？

なんのためにそのようなことをするのか次第

297 = :

>>296
ページによって動的に変化させる為、srcの文字列を変数のように扱いたいから。
表示されるページの所定の箇所を取得してsrcに入れる。

298 = :

1っ箇所だけなのでMVVMフレームワーク使えとかはナシの方向で。。

299 = :

>>297
それなら一般的にはCSSを使う。

まず、ページごとにユニークな名前をつけて
それをhtml要素、またはbody要素のidかclassに入れる

例
<html id="page-a"> とか <body class="page-b">

あとは、CSSで画像を指定する。

#page-a .name { background-image: 画像URL }
#page-b .name { background-image: 画像URL }

300 = :

ふつうに $(document).ready だろ。