【jQuery】JavaScript ライブラリ総合質問所 vol.1

1 ：12/01/29 〜 最終レス ：12/05/28

JavaScriptライブラリ を自ら学ぶ人のための質問スレッドです。
>>2のテンプレを読んだ上で質問してください。
■質問を書く上で
(1) 質問にならない投稿はご遠慮ください。(煽り、コード制作依頼など)
(2) 他の人に迷惑をかけるスクリプトの質問はご遠慮ください。
　　(ブラクラ、[戻る], [閉じる], [クリック] の妨害、画面占有など)
(3) 長い間連続して質問する場合にレス番を名前にしてあれば、質問の流れが回答者に伝わりやすくなります。
(4) 常に自発的に調べる心構えを持ってください。
　　具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。
　　わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。
(5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。
(6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。
　　※必ず「問題の事象が再現されること」を確認してください。
　　　必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。
(7) サンプルコードに HTML が含まれる場合は http://validator.w3.org/ で [Check] してみてください。
(8) 質問を具体的かつ詳細に書くと回答を得られやすいです。質問テンプレートを活用してみてください。
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4)
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用)
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
　1レスに収まらないならコード投稿サイトを利用してください。
　http://jsdo.it/　http://jsbin.com/　http://jsfiddle.net/　http://ideone.com/

2 ：

■前スレ
無し
■主要FAQ
無し
■関連スレ
+ JavaScript の質問用スレッド vol.97 +
http://toro.2ch.net/test/read.cgi/hp/1327750531/
■各種仕様
無し

3 ：

質問するときは使用しているライブラリ名をハッキリ明記するようにしましょう。
ライブラリがあまり絡まない基本的な問題は>>2の本スレに誘導。
テンプレ相談は>>750くらいから。

4 ：

主要なライブラリ
jQuery
jQuery Mobile
prototype.js
mootools
Yahoo! User Interface Library

5 ：

Ext.js
Sencha.js
あたりもか

6 ：

【期待される当面のスレの進行】
早急な回答は期待できません。
しばらくは少しjQueryが絡む程度なら本スレでの質問を推奨します。
逆に本スレで相手にされないようなマイナーな環境や、
嫌がられるようなプラグインバリバリの質問はこちらですることがオススメです。
きっと優しい回答者様達がじっくりと回答してくれます。
回答者は時間がかかってもいいので、わかる範囲でできるだけ回答してあげてください。

7 ：

スライドショーでjqueryつこうてるのですけど
切り替えの早さとかの設定してますか？
dualirationとかpauseの設定です

8 ：

値です

9 ：

ライブラリとフレームワークは違う

10 ：

JavaScriptにとってそんなに違いはない

11 ：

Dojo最高じゃねぇか

12 ：

Dojoとかどこかの総理大臣を思い出すから勘弁して

13 ：

スレタイの前にｊQueryだけ入っているところが恣意的

14 ：

>>13
いや、違うんですよ。
二つ入れたかったんだけど文字数制限で。
次スレから自由に改良してもらって構わないです。

15 ：

jQueryの質問は多いと思うし、このままでいいと思う。
まあ、まだ何の質問もないけどなｗ

16 ：

じゃあ質問
jQuery UIのdialog内でselectメニューを使うとクリック（タッチ）しても、
ブラウザによってはプルダウンが出てこない問題でハマってるんだけど
何故だか分かる方、同じ地雷を喰らった方いますでしょうか？

17 ：

そんなことよくある
ブラウザによっては動きませんとか言うのが間違いない
動かしたいブラウザで動くように作るのが正解
諦めるのが次点

18 ：

じゃあjQuery使わないのが正解になるやん

19 ：

zIndexが変になってるとかじゃないの

20 ：

>>18当たり前だろ
jQueryだけでなんでも簡単にできるんなら皆jQuery使うわ

21 ：

つまりjQueryで楽しようとしても無理ですってことか
まーそらそうだよな

22 ：

jQuery UIとかオワコンだと思ってた

23 ：

そうなの？
jQueryより後から出てきたものではないの？

24 ：

jQueryは全部のブラウザに対応している訳じゃない。
けど、ほとんどのブラウザで動作確認されている。
jQueryで正常動作しないブラウザは、よほど特殊かマイナー
もしくは、もう古いブラウザーって事だろ、切り捨ててOK範囲。
切り捨てる事ができないのなら、jQueryで作った上で対応してないブラウザに個別対応するのが確実。

25 ：

>>24
の言う通り
レゴを使えば簡単に物体が作れるが細かい部分に限界があるのと同じ

26 ：

>jQueryで正常動作しないブラウザは、よほど特殊かマイナー
俺もそう思って採用したんだけど、ここ一年以内のAndroid端末で動かないんだぜ…
Xperia Arcって特殊かマイナー？

27 ：

>>26
Android持ってないからわかんねーや
iPhoneのSafariとかは正常に動作してるけどな。
mouseoverの当たりとかはダメだけど。
待ってれば対応する可能性高いと思うが今は個別対応するしかないんじゃね？

28 ：

いやいや
何のためにjQueryMobileがあると思ってんの

29 ：

jQuery Mobileは残念ながら、まだ今の端末ではまともに動かないね

30 ：

> 正常に動作してるけどな。
> mouseoverの当たりとかはダメだけど。
こういうのってどういう気持ちで書くんだろ

31 ：

バカが釣れるかどうかワクワクしながら書くんじゃね？

32 ：

>>30
iPhoneでmouseoverイベントなんて取れないんじゃねーの？

33 ：

だから釣りだろ

34 ：

jQuery mobileの開閉式コンテンツに動的に要素を追加した場合に表示をリフレッシュする方法が分からなくて困っているのですが、どうしたらよいでしょうか。
リストの場合はlistview("refresh")のようにやると思うのですが、開閉式コンテンツの場合の方法がリファレンスに記述されてないので。

35 ：

history.go(0)

36 ：

.page()

37 ：

>>36
返信遅れましたが、page()でリフレッシュできました。
ありがとうございました。

38 ：

jQuery mobileって、ａタグは使えないのでしょうか？
MTで使いたいのですが、記事のなかにaタグとかあると
どうなるのでしょうか？

39 ：

Web制作の現場で使う jQueryデザイン入門
jQueryデザインブック　仕事で絶対に使うプロのテクニック
どっちがおすすめですか？

40 ：

読んだこと無いからわからんが、自分でじっくり立ち読みして決めるべき
今まさに興味がある知りたい項目を読んでみて理解できるかどうか
索引を見て知りたかった用語が載っているか、その解説が理解できるか
人それぞれ知識のレベルが違うので合う本も違ってくる
ただ、IT関連書籍は日本語が不自由な本が多くて読むだけ無駄な場合が多々ある

41 ：

>>39
アマゾンの評価みれば？
それか、両方買えばいいんじゃね？

42 ：

jquery mobileって何でこんなに人気があるんだ
似たようなデザインばっかりで吐き気がする

43 ：

>>40
> IT関連書籍は日本語が不自由な本が多くて
全くだわ。なんなんだろうな。

44 ：

文系エンジニアはそういったの書けるほどの理解が足らない場合が多いし
理系エンジニアは自分の理解の上で書くから理解させる文章が書けないというか
まぁ何系による話しでもないか

45 ：

理解に経験が相まって、高みの視点から解説されている文章は
読んでてすんなり頭に入ってくるし、面白いと感じるけども、
まぁ、少ないな。
とにかく、一定数の販売が見込めるからという理由で銭目当てで
出版するのは勘弁してほしいわ。

46 ：

質問させて下さい。
DBからJavaで取得したListをjQueryで検索かけたいのですが、
JavaのListをどうやってjQueryで扱えばいいですか？
検索結果が少ないので、あらかじめ全項目取得してフォームの入力項目に併せて
動的に結果を表示させたいのですが…。

47 ：

すみません。追記です。環境は
windowsXP 使用してるフレームワークはSAStrutsです。
<html:radio property="sample"
value="${number}"
onclick="$('#divTag').load('${f:url('search/')}${number}');"
/>
このようなやり方で、戻り値に別に用意したJSPを用意する事で、
ラジオボタンチェックで動的に値を取得して表示させることはできるのですが、
いちいちサーバーにアクセスするので、ページ表示時にjQueryが
全データを持っていて、それを検索していくことを実現させたいです。
よろしくお願いします。

48 ：

>>42
じゃ、CSSカスタマイズすりゃいいじゃん。
基本機能は実装されてるけど、後は自分でカスタマイズしてね。
フレームワークってそういうもんじゃね？

49 ：

>>45
年末に出たオライリーのjQueryMobile翻訳版がまさに。
2000円を捨てた感じがしたよ。

50 ：

>>47
あらかじめ文字列成形したリストを吐き出して、Ajaxで取得じゃダメ？

51 ：

鯖アクセスが無駄ってことだろう。とりあえずJavaがわからん

52 ：

>>47
Strutsのテンプレートみたいなもんなんだろうけど
そういった書き方はおすすめせんな
あとHTMLの勉強すれば理解できる程度のもんだよそれ

53 ：

JSPでscriptタグ生成すれば?
<script>
var data = ['foo', 'bar'];
</script>
とかになるように。
しかし、JSPの$とjQueryの$が混ざるとわかりにくいな。

54 ：

皆さんありがとうございます。
var data = ['foo', 'bar'];
なるほど、こうやれば配列を渡せるのですね。
今出先なので帰ったら試してみます。
あれから考えていたのですが、
一度JSPで全データのhtmlを書き出して
そのhtmlをラジオフォームのチェック状況を踏まえて
整形していくというやり方は可能でしょうか？
jQueryでラジオフォームの値と同じ値のDivは非表示、
というような処理が必要かと思うのですが…。
携帯の為個々にレスできずにすみませんが、お願いします。

55 ：

追記させて下さい。
現在一度全データをHTMLに書き出し、そのHTMLを成形させる手法で実装を進めています。
現在下記のソースにより想定している動作を実現しました。
$(function() {
//全データが書き出されるので非表示に。
$(focus).toggle();
});
function sample(number) {
var test = "#" + number;
$(focus).css("display", "none");
$(focus).filter(test)
.toggle();
};
------------
<html:radio property="sample" value="${idNumber}" onclick="sample(${idNumber})" />
しかしながら、toggleは単なる表示/非表示の切り替えなので、
呼び出しの度にdisplay:noneを行い、該当箇所をtoggleという処理が無駄だそうなので、
toggle()の箇所を単に「表示」にし、その他は排除する機能を持った
メソッドを使いたいのですが見当たりません。
度々申し訳ないのですが、参考になるサイト等ございませんでしょうか。

56 ：

>>55
$(focus).hide().filter(test).show();
でいいんじゃね?(未テスト)
show/hideはすでに表示/非表示になっているときには何もしないから、
css("display", "none");するのとちょっと違う。
それから、全データを書きだしてから非表示するんじゃなくて
HTMLの段階で非表示にしておくほうがいいんじゃないかなあ。

57 ：

しまった
>show/hideはすでに表示/非表示になっているときには何もしないから、
ソースみたらhideの方は無条件で none に入れてる。
$(focus).filter(":visible").hide();
$(focus).filter(test).show();
ってしたほうがいいかも。
あるいは、前回クリックしたnumberをどこかに覚えておくとかかな。
.data() を使うといいよ。グローバル変数でもいいだろうけど。

58 ：

複数のバージョン違いのjQueryが読み込まれる環境で汚染を避けたいのですが
$my = jQuery.noConflict(true); とすることで$だけでなくjQuery自体も元に戻ると考えていいのでしょうか？

59 ：

>>58
そうです

60 ：

>>59
ありがとこざいます!!

61 ：

CSSでボタンを作って
<button class="cssbutton" id="xxxxx" onclick="funcAAA(aa,bb,cc);">ボタン</button>
と表示していますが、onclickで実行される関数funcAAAの中で
ボタンのidを取り出すことはできないでしょうか？
$(this).attr("id")などとやっても取れませんでした。thisがbuttonタグを指さないみたいです

62 ：

>>61
どうして中途半端にjQueryのclick使わずonclickでイベント拾ってるの？

63 ：

>>62
ボタンが沢山あるページを、PHPで動的にHTMLを吐き出していて、
ボタンによってfuncAAAへの引数が変わる
jQueryのclickでできなくもないけど、上の方法がシンプルだったのでそうしました

64 ：

>>63
・・・そうか。
でも、俺が言いたかったのはちょっと違って・・・
クリックのイベントもjQueryで受ければthisが使えるよって事で・・・
$("button").click(function() {
alert($(this).attr("id"));
});
こんな感じにすればいいんじゃないの？

65 ：

Yahoo YUI ver2.9のDatatableって改行させないで初期表示時に
文字列全体を表示してる状態にできないでしょうか。（ズレなど無しで）
私が試したところ、改行させないで文字列全体を初期表示はできたのですが
ラベルと幅がズレてしまいました。。。

66 ：

>>61
onclick="funcAAA(this.id);"

67 ：

やはり引数でid渡すのが一番変更少なくすみそうなので
素直にそれでしのいどきます

68 ：

<button class="cssbutton" id="xxxxx" data-aa="1" data-bb="2" data-cc="3">ボタン</button>
$('button.cssbutton').click(function(e){
var button = $(this);
var aa = button.data('aa');
var id = button.attr('id');
});

69 ：

なるほど
次はそうしてみます

70 ：

こちらに誘導されました。
ド素人ですんませんがどなたかご教授お願いします
プルアップメニューなんだけど、スマホから閲覧すると初回タップ時だけhove（文字色のハイライトなど）がうまく機能しません。
別の場所をタップしたり、閉じたり開いたりすると機能するようになります。
どうにか初回からばっちりhoverを機能させる方法はないでしょうか？
Firefox3.6では正常な動作でした。
$(function(){
$("ul.sub_list").hide();
$("ul#ul_menu>li").hover(function(){
$("ul:not(:animated)",this).slideDown()
},
function(){
$("ul",this).slideUp();
})
$(".close").click(function(){
$("ul.sub_list").slideUp();
});
})

71 ：

簡単な事ならライブラリを使わない方がトラブルが少ないかもしれない
ま、ライブラリを使わずにやってみることだな…
それでもおかしいならブラウザの問題かもしれない…
タッチパネル操作は仕様差がややこしいからな
僅かに全部の機種で違うと言ってもいいくらいだ

72 ：

なるほどーブラウザの問題の可能性もあるんですね
全ての機種で確認できる訳ではありませんし、無理に設置するのはやめておきます
ありがとうございました！

73 ：

if (!document.getElementById('id')) {
　return;
}
このidが存在しない時の判定ってどのようにすればいいのでしょうか

74 ：

もうそれでできてるよ
"id"が存在しない
↓
document.getElementById("id")はnullになる
↓
!document.getElementById("id")すなわち!nullはtrueとなる
↓
ifブロックが実行される
つまりreturnの直前に
alert("要素がありまちぇん！");
って書いとけばＯＫ

75 ：

>>74
すみません
質問に"jQueryで書き直したい"と書き忘れてました > <
(!document.getElementById('id'))
この部分をjQuery風に書きたいのです
空のjQueryオブジェクト(?)を判定すれば行けると思うのですが
if (!$("#id")) {
　alert("ない");
}
イメージ的にはこんな感じで・・・

76 ：

lengthを見るかsizeメソッド
ttp://api.jquery.com/length/
ttp://api.jquery.com/size/

77 ：

>>76
ありがとこざいましたm(__)m

78 ：

jQueryUIで拡張されたshow()メソッドの第2引数（options）に設定可能なパラメータってどこで調べられますか？

79 ：

ttp://api.jquery.com/animate/

80 ：

Firebugとかデバッガで書き換えられない変数を作成する方法を教えてください

81 ：

>>80
スクリプトをevalで実行

82 ：

jQueryUIで、$( "<div>" ).dialog().attr('id', 'id1')もしくは$( "<div id="id1">" ).dialog();
の様に動的に作成したダイアログにid属性を付加したいのですが、デバッガで確認するとid属性値が付加されていません。
どこがおかしいか教えて頂けないでしょうか。よろしくお願いします。

83 ：

もしかして.dialog()で作成したダイアログにはid属性を付加できないんですかね。。

84 ：

>>81
は？

85 ：

ドキュメント上のある位置にある要素を特定するにはどうすればよいでしょうか ？

86 ：

何がしたいのかもっと詳しく
できればHTMLを張ってどこを特定したいのかｋｗｓｋ

87 ：

>>86
ちょっと説明しづらいのですが、複数の要素をdraggableで適当に動かした後、
ドキュメント上のある位置にある要素を求めたいのです。
例えばtop、left100px以内にあるのはどのidの要素か、などです。
わかりづらくてすいません

88 ：

複数の要素を全部調べるか、移動するたびに、ある位置に配置されたかどうかを保持しておくか。

89 ：

>>88
すいません、全部調べるのはどういう方法がありますか？
あと、位置を保持するのはoffsetとか使ってでしょうか？

90 ：

$("b:eq(0)") と $("b").eq(0) って同じですね？
どっち使ったほうが良いのでしょうか

91 ：

>>82-83
なぜidが必要かが疑問（どんなケース？）が、付加はされている
どのdiv要素がdialogの戻り値になっているかもう一度確認
> $( "<div>" ).dialog().attr('id', 'id1')
↓
$( "<div>" ).dialog().parent().attr('id', 'id1')
恐らくこうだろうという修正案
>>89
ttp://jsfiddle.net/6FrZd/
1つの例として位置と大きさから座標の範囲を割り出す方法を考えたが、
細かい要求はわからないし妥当かどうか自信もないので参考程度に
>>90
その例ならどちらでも

92 ：

質問するときはバージョンとライブラリ名も書けや
あと連携してるライブラリもあればそれの名前とバージョンもな！

93 ：

>>90
両方使うのではなくどちらかに統一しろ
俺なら要素と分けて考えたいから後者を使う

94 ：

速度なら前者

95 ：

逆じゃね?

96 ：

簡単なサンプルケースでやってみたが後者のが速かった

97 ：

<input type="checkbox" id="anyid" />チェックボックス１
この場合文字列「チェックボックス１」を取得するにはどう表現したらいいでしょうか？
<input type="checkbox"id="anyid" >チェックボックス１</input>
であるなら
$("#anyid" input).html()で取得できると思うのですが、このようにhtml部分を書き換えさせた方がいいでしょうか？

98 ：

<label><input>hogehoge</label>
で
.parent().text()

99 ：

なるほどその方がスマートですね

100read 1read

1read 100read

TOP カテ一覧 スレ一覧 2ch元 削除依頼 ▲

ゴッゴル (451)
【笑える】検索キーワード【笑えない】 (103)
自分のホムペの弱点を書くスレ (936)
Webサイト制作初心者用質問スレ part229 (812)
Nvu(エヌビュー)スレ @ Web制作板 (422)
Photoshop&Illustrator関連スレッドPart13 (397)
--log9.info------------------
　　加藤いづみのオールナイトニッポン　　 (279)
【MJ AH】みうらじゅんと安齋肇のGT【TR2】 (456)
松任谷由実のオールナイトニッポン (112)
斉藤一美のとんかつワイド (189)
テール・オブ・ア・テラー (339)
【ﾊﾞｶﾔﾛｰ】イルカのオールナイトニッポン (124)
【台湾ドラマ】ﾎｿﾎﾞｿと語る専用ｽﾚｯﾄﾞ10【全国版】 (958)
【Eテレ】glee グリー ♪2【ネタバレ禁止】 (963)
FRIENDS フレンズ part33 (650)
Supernatural スーパーナチュラル part14 (712)
単独スレの立たない韓国時代劇 (285)
【DVD】プリティ・リトル・ライアーズ【ネタバレ】 (194)
【Dlife】プリティ・リトル・ライアーズ【バレ禁】6 (558)
【バレ禁】ウォーキング・デッド 【FOX】16 (362)
【ソニ】ラスト・スキャンダル【ドンチョル】 Part4 (862)
【BSﾌﾟﾚﾐｱﾑ】デスパレートな妻たち 61【ﾈﾀﾊﾞﾚ禁止】 (611)
--log55.com------------------
【医学町通りにも】森塾　part3【あるよ】
私立医学部受験の予備校 Part6
【紫スーツの】荻野暢也 Lev.16【数学893】
予備校に行きたくない・やめたい浪人生part1
【63教室だよ】代ゼミ名古屋校part44【全員集合】
【代ゼミ英語】西谷昇二・２講目
代ゼミレポートを回収するスレ【親バレ阻止】
【データ主義】祝田秀全２【本名は功吉】
2012.6.23/14:8:19 最上へ　書込へ
画像全画面侮ｦ+リロードで切り替えをしたいのですが、