JavaScript ライブラリ総合質問所 vol.4
: Name_Not_Found [sage] 2014/05/23(金) 17:35:17.23 ID:??? JavaScriptライブラリ を自ら学ぶ人のための質問スレッドです。 ■質問を書く上で (1) 質問にならない投稿はご遠慮ください。(煽り、コード制作依頼など) (2) 他の人に迷惑をかけるスクリプトの質問はご遠慮ください。 (ブラクラ、[戻る], [閉じる], [クリック] の妨害、画面占有など) (3) 長い間連続して質問する場合にレス番を名前にしてあれば、質問の流れが回答者に伝わりやすくなります。 (4) 常に自発的に調べる心構えを持ってください。 具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。 わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。 (5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。 (6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。 ※必ず「問題の事象が再現されること」を確認してください。 必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。 (7) サンプルコードに HTML が含まれる場合は ttp://validator.w3.org/ で [Check] してみてください。 (8) 質問を具体的かつ詳細に書くと回答を得られやすいです。質問テンプレートを活用してみてください。 ■質問テンプレート 【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4) 【ライブラリ】使用しているライブラリ名を記入してください。(ex: jQuery) 【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。 【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用) 【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。 【サンプルコード】現象を再現可能な最小限のコードを書いてください。 1レスに収まらないならコード投稿サイトを利用してください。 ttp://jsdo.it/ ttp://jsbin.com/ ttp://jsfiddle.net/ ttp://ideone.com/ : Name_Not_Found [sage] 2014/05/23(金) 17:36:27.60 ID:??? ■前スレ 【jQuery】JavaScript ライブラリ総合質問所 vol.3 ttp://toro.2ch.net/test/read.cgi/hp/1369444026/ ■関連スレ + JavaScript の質問用スレッド vol.115 + ttp://toro.2ch.net/test/read.cgi/hp/1399072595/ ECMAScript デス 4 ttp://toro.2ch.net/test/read.cgi/tech/1325448978/ JavaScript Tips コレクション ttp://toro.2ch.net/test/read.cgi/hp/1070611524/ 1行javascriptプログラミング ttp://toro.2ch.net/test/read.cgi/hp/1066750037/ 【node.js】サーバサイドjavascript 2【Rhino】 ttp://toro.2ch.net/test/read.cgi/tech/1358937029/ ■各種ライブラリ jQuery API Documentation ttp://api.jquery.com/ jQuery Mobile API Documentation ttp://api.jquerymobile.com/ prototype.js ttp://prototypejs.org/ API Docs - YUI Library ttp://yuilibrary.com/yui/docs/api/ Underscore.js ttp://underscorejs.org/ : Name_Not_Found [] 2014/05/24(土) 21:30:56.35 :GOOxnsAs プログラミング初心者な質問で申し訳ないのですが jQueryで配列を複数個呼び出すときってどう書けばよいのでしょうか? [0]と[2]だけを呼び出したいのですが・・ var arr = $('#meta').toArray(); $('p').append(arr[0][2]);←こんな感じで呼び出したいのですが : Name_Not_Found [sage] 2014/05/24(土) 21:48:21.17 ID:??? $('p').append(arr[0], arr[2]); // 最も、arr[2] は undefined だけど : 3 [] 2014/05/24(土) 21:57:12.79 :GOOxnsAs できました!ありがとうございます!! >var arr = $('#meta').toArray(); はvar arr = $('#meta').find('a').toArray();の間違いです。失礼しました : Name_Not_Found [sage] 2014/05/24(土) 21:59:46.20 ID:??? ついでにいうと toArray() も不要 : 3 [sage] 2014/05/24(土) 22:08:11.34 ID:??? うおっ。確かにw 重ねてありがとうございます! : Name_Not_Found [sage] 2014/05/24(土) 23:55:20.79 ID:??? nikkeiモバイルにアクセスしたら、 「データベースサイズを増やしますか」って聞かれたんだけど ttp://news.mynavi.jp/articles/2013/06/03/iphone_why67/ これはLocalStorageを5MBから10MBに拡張できるってことだよね? これをJS上で明示的にユーザーに問い合わせるにはどうすればいいんでしょう? : Name_Not_Found [sage] 2014/05/25(日) 00:55:49.47 ID:??? jQueryで$('.class名')と指定するのは 推奨されないと聞いた事あるのですが、 要素が同じ場合は、$('要素名').filter('.class名')と書けばよいですか? : Name_Not_Found [sage] 2014/05/25(日) 02:33:54.90 ID:??? 推奨されない理由を調べて それから考えよう。 : Name_Not_Found [sage] 2014/05/25(日) 05:03:44.12 ID:??? 問い合わせフォームのこと? JSなら、document.forms jQueryなら、フォーム要素を使う jQueryの方が簡単 : Name_Not_Found [sage] 2014/05/25(日) 09:11:37.81 ID:??? すみません、聞き方が悪かったです。 標準だとたしかLocalStorageが5Mしか容量ないものを 10MBまで拡張させる方法が知りたいということです。 : Name_Not_Found [sage] 2014/05/25(日) 15:07:36.76 ID:??? ブラウザ個別の機能では?例えば Chrome API の storage では容量を変えられる。 : Name_Not_Found [sage] 2014/05/25(日) 21:25:19.10 ID:??? そんなAPIがあるんですね。ありがとうございます。 : Name_Not_Found [sage] 2014/05/26(月) 09:10:27.08 ID:??? bootstrapでpopoverがmousedownのタイミングで閉じてほしいのですが どうすればいいですか? : Name_Not_Found [sage] 2014/05/26(月) 11:40:13.22 ID:??? ttp://getbootstrap.com/javascript/ ここのdropdownのサンプルを見るとクリックで閉じるのはデフォルト動作のようです しかし本来ドロップダウンはmousedownで閉じられるべきもので、 OSもそのようになっています どうしたら・・ : Name_Not_Found [sage] 2014/05/26(月) 12:49:59.03 ID:??? Bootstrapにその機能がないなら諦めとけ Bootstrapを使うときは、Bootstrapで用意された機能や デザインをそのまま受け入れること。 下手に自分のこだわりを通そうとするとハマる。 : Name_Not_Found [sage] 2014/05/26(月) 13:55:24.20 ID:??? jqueryで「指定したクラスを持つ子要素を持つdiv」を指定する方法を教えて下さい : Name_Not_Found [sage] 2014/05/26(月) 14:16:34.63 ID:??? ttp://zng.info/specs/css3-selectors.html#child-combinators ttp://api.jquery.com/parents/ : Name_Not_Found [sage] 2014/05/26(月) 14:42:10.70 ID:??? ありがとうございました : Name_Not_Found [sage] 2014/05/27(火) 15:38:42.02 ID:??? gruntが使えるならソースコードの方をダウンロードしてdropdown.jsを書き換えてからjsをビルドする。 使えないならミニファイされてないjsを書き換えて使えば良いんじゃない? : Name_Not_Found [sage] 2014/05/28(水) 19:19:19.44 ID:??? 表を作るライブラリみたいのありませんか? カラムで並び替えたりできるやつです : Name_Not_Found [sage] 2014/05/29(木) 00:34:50.28 ID:??? ttp://codezine.jp/article/detail/6636 : Name_Not_Found [sage] 2014/05/29(木) 04:47:11.32 ID:??? ありがとうございます : Name_Not_Found [sage] 2014/05/29(木) 08:53:43.58 ID:??? jqueryでドルを単体で使った場合、ドルは何を指し示しているんですか? こんな感じ↓名前空間? $.getJson() : Name_Not_Found [sage] 2014/05/29(木) 19:16:58.69 ID:??? ttp://api.jquery.com/jQuery/ : Name_Not_Found [] 2014/05/30(金) 01:33:01.22 :z/9nF5hg ttp://jsbin.com/doyakubo/1/edit @をSample.htmlAをSample.cssと名前をつけて同一フォルダに保存したけど動作しない。 原因わかる人いないかな? テキストエディットとsafariを使ってます。 : Name_Not_Found [sage] 2014/05/30(金) 14:13:54.69 ID:??? 動いたけど ttp://jsbin.com/doyakubo/4 JSBinの使い方間違ってるんじゃない? テンプレにもあるように ttp://validator.w3.org/ ぐらいチェックして それからライブラリの質問じゃないからスレ違い : Name_Not_Found [] 2014/05/30(金) 15:14:52.96 :z/9nF5hg おっと、それは失礼した : Name_Not_Found [sage] 2014/05/30(金) 16:25:24.43 ID:??? domの作成をjqueryでやるメリットは何でしょうか? 作成に限って言えば、生JSで作成してもコーディング量、簡便さなど大差ない気がします : Name_Not_Found [sage] 2014/05/30(金) 22:09:23.55 ID:??? 通常作成するだけじゃ終わらないからです。 DOMを作成したら、そのあとイベントを割り当てたりするでしょう? : Name_Not_Found [sage] 2014/05/31(土) 10:27:15.42 ID:??? ノード作成をjQuery出やらないほうが便利な場面もあるし、jQueryでなければならない必然性はない DOM APIに慣れるとjQueryが使いがたいと思う場面は確かにある : Name_Not_Found [sage] 2014/05/31(土) 11:12:28.11 ID:??? DOM APIの何が嫌かって、スペルが長いことなんだよな。 document.getElementById('a').addEventListener('click', function() {}); $('#a').on('click', function() {}); もしくは $('#a').click(function() {}); これだけでもDOM APIは嫌になるが、jQueryはさらに セレクタをクラス名にするなどして、当てはまる要素全てに イベントつけられるし。 DOMを扱う行が10行を超えたら、もうjQueryを使ったほうがいいと思う。 : Name_Not_Found [sage] 2014/05/31(土) 15:12:28.67 ID:??? それDOMのだと、もし#aの要素が無かったら…とか考えてしまう : Name_Not_Found [sage] 2014/05/31(土) 15:19:49.70 ID:??? それが健全な考え方だろう しかし、ないときにエラーにならないのはもっと困る : Name_Not_Found [sage] 2014/05/31(土) 15:37:27.25 ID:??? jQueryはエラーにならないのか これは面倒くさいな... jQuery('#hogehoge').on('click', lisetener); // #hogehogeが存在しなくてもエラーにならない : Name_Not_Found [sage] 2014/05/31(土) 16:27:52.77 ID:??? 存在しないことが想定されている場合には、nullチェックしなくていいからjQueryが楽 想定外ならjQueryは発見が遅れるって感じ : Name_Not_Found [sage] 2014/05/31(土) 16:43:22.92 ID:??? イベント定義するなら該当要素が存在する事を保証したロジックにする しかし、それでも想定ミスで存在しなかったのならエラーになるのが望ましい そうでないのなら、要素の存在有無でコードを条件分岐させるのが望ましい …と俺は思う : Name_Not_Found [sage] 2014/05/31(土) 23:26:00.78 ID:??? いやそれは、IDで指定しているからそう思うんだよ。 #('.hoge').on()だと考えてみな。 .hogeは0個以上。 つまり要素が複数あってもなくても コードを変える必要がない。 これは空の配列やNULLオブジェクトパターンにもつながる考え方。 たまに、var o; o = $('.o'); if(o.length) { o.on(・・・) } とか var o = null; if(何かの条件) { o = なにか } if(o) { o.on(・・・) } みたいな チェックコードをかく人がいるけど、 var o = $(); o.on(・・・) という単純なコードでいいんだよね。 「0個以上の当てはまる要素」という風に一般化して考える。 : Name_Not_Found [sage] 2014/05/31(土) 23:30:23.05 ID:??? 要素があるかないかをいちいち調べるコードっていうのは これみたいなあほさがあるよね。 ※ aは配列 if (a.length > 0) { // ← 意味が無いチェック for(var i = 0, max = a.length; i < max; i++) { console.log(a[i]); } } : Name_Not_Found [sage] 2014/05/31(土) 23:41:54.81 ID:??? HTMLとcssの関係と同じだけど、 HTMLとJavaScriptの関係っていうのは そういう風に密接につながったものじゃない。 それぞれ独立しているもの。 要素があるかないかを考える以前に、 要素があるかないかってのはわからないと考えるべき。 だから、ID指定でjQueryを使うっていうのは だいたい間違った考えなんだよね。 だからjQueryのセレクタはクラス(や要素名や名前属性など)で指定し、 HTMLにはその要素はあってもなくてもいいものとして作る。 : Name_Not_Found [sage] 2014/06/01(日) 08:59:16.69 ID:??? ノードリストならDOM APIでも普通に書けばエラーにならないけど、それは比較対象として適切? そりゃあ、jQueryは内部的には配列だからそういう挙動になるだろうけど、「動くか動かないかわからない」という本質は変わってないよね idで指定したときの問題に対してノードリストを上げるのは論理のすり替えじゃないの? : 38 [] 2014/06/01(日) 10:02:58.37 :+HbjAZUe idかclassかは問題の本質とは関係ない 重要なのは「要素の存在を保証できるかどうか」だ 存在を保証できる場合というのは例えば、HTMLで事前に該当要素を書いている場合や要素の挿入直後の場合だ この場合は要素が存在することは確定しているのでコード上で要素が非存在となるならエラーになることが望ましい 基本的にはしっかりとアルゴリズムを組めば要素の存在は保証できる しかし、要素のappendChild, removeChild を繰り返す度にイベント定義する場合や多量ノードにイベント定義する場合は別だ この場合はバブリングを利用して上位ノードに一つだけイベント定義するのが望ましい そうすれば要素を入れ替える度の処理が不要になり、メモリ消費も削減できる --- ノードリストでイベント指定する場合はのいうように普通に組めばエラーにならない 存在確定する状況ならエラーにしてもいいが、それは人に依るだろう 最も、この場合はバブリング可能で上位ノードにイベント定義する場合が多く、その場合は上位ノードの存在保証が必要になる (clickはバブリング可能なのであなたの出した例なら上位ノードを指定する) > 要素があるかないかってのはわからないと考えるべき。 そもそも、アルゴリズムで要素の存在は保証されるべきだ 存在不明の要素にイベント定義するということは、そのイベントが動作する保証もないという事だ そして、動かなかった時に「要素が存在しなくて動かなかったのか」「ハンドラのコードバグで動かなかったのか」の原因切り分けが全く出来てない状態からデバッグすることになる これは良い実装とはいえない : Name_Not_Found [sage] 2014/06/01(日) 13:55:58.15 ID:??? それは考え方が単純だよ。 「要素が絶対に存在していなければならない時」はなくてエラーなっても良いが、 「要素が存在していなくてもいい時」はエラーにならない方がいい。 HTMLをウェブAPIを実行するための入力フォームだと考えれば、 特定の画面にそのフォームがなければならないことというのはまず無い。 たとえば削除ボタン(POSTするフォーム)があったとしよう。 そのボタンに対してJavaScriptで確認ダイアログを表示するとしよう。 この削除ボタンはどのページにでも移動可能。そして一般的に JavaScriptはHTMLに対してちょこっと付加価値を付けるという扱いで使うべき。 つまりこの削除ボタンに、特定のクラスをつけ、JavaScriptは そのクラスに対して処理を付加することになる。 そして、この削除ボタンはデザイナーの都合で表示されなくなったり別のページに移動したりするわけ。 それでも、特定のクラスをつけた場合は全て同じ動きをする。 というベストプラクティスを達成する場合、クラスの有り無しを意識しちゃダメなんだよ。 : Name_Not_Found [] 2014/06/01(日) 17:31:29.21 :VwYpQ2Ui jQueryのDatepicker プラグインで 結果をyyyy mm dd の3つ分けて入力する方法がわかりません。。。 2つに分ける方法は以下に出ていたのですが 私のレベルでは3つに分けられませんでした。 --------------- jQuery( function() { jQuery( '#jquery-ui-datepicker' ) . datepicker( { altField: '#jquery-ui-datepicker-alternate', altFormat: 'yy' } ); } ); ---HTML--- <input type="text" id="jquery-ui-datepicker"> <input type="text" id="jquery-ui-datepicker-alternate"/> : Name_Not_Found [sage] 2014/06/01(日) 20:54:05.69 ID:??? jqueryである要素を空にするにはどうしたらいいですか? : Name_Not_Found [sage] 2014/06/01(日) 22:14:58.18 ID:??? ttp://www.softel.co.jp/blogs/tech/archives/92 こういうことではなく? : Name_Not_Found [sage] 2014/06/01(日) 22:17:40.18 ID:??? 空にしてタグだけ残すなら $("ある要素").html(""); タグごと消すなら $("ある要素").remove(); : 38 [] 2014/06/02(月) 08:56:45.61 :VTiDKCUb シンプルなプログラムならその考え方でいいが…。 「イベントA→イベントB→イベントC」の順に依存関係が存在した場合、イベントAが定義されないならイベントB,Cも定義されないのが望ましい。 jQueryでは定義/未定義を判別できず、例えばイベントBだけ定義された状況で思わぬバグを引き起こす可能性がある。 どちらかといえば、あなたの方が想定する状況を限定しすぎている(単純化している)ように思うが…。 バブリングについての意見はないのか? 一つだけの要素にイベント定義する場合も十分あるはずだが…。 : Name_Not_Found [sage] 2014/06/02(月) 11:57:40.40 ID:??? なんでイベントに依存関係があるんだよ? 依存関係があるのなら、それを一つにまとめるだけの話だろ。 : Name_Not_Found [sage] 2014/06/02(月) 12:37:38.06 ID:??? 一般論としてイベントに依存関係があるという話ではなく、処理の流れで依存関係が出来ると読めたけど 処理Bより先に処理Aが先に実行されてなければならない状況はあるでしょ? 大規模開発なら処理を分けることはあるし、まとめることが必ずしも良いとは限らない : Name_Not_Found [sage] 2014/06/02(月) 13:06:36.55 ID:??? いや、一つのイベントでだろ? たとえばクリックした時に、 違う処理を二つやんのか? まずないね。 : Name_Not_Found [sage] 2014/06/02(月) 14:56:16.85 ID:??? jqueryオブジェクトに _hoge などの独自プロパティ持たせてもいいんですか? : Name_Not_Found [sage] 2014/06/02(月) 15:00:43.45 ID:??? 独自プロパティ持たせるぐらいなら 専用のdataメソッドあるだろ。 あとjQueryプラグインの”正しい"拡張は そのように独自プロパティやメソッドを 追加することに等しい。 だから”正しい"方法であれば持たせて良い。 : 45 [] 2014/06/02(月) 16:43:15.58 :Ew2HfRUY 有難うございます!! 助かりました。 どうやら、検索レベルの方が問題のようでした・・・ : Name_Not_Found [sage] 2014/06/03(火) 11:27:29.70 ID:??? googleで計算式を入力すると答えが出ますが ああいう風に数式から答えを算出するライブラリありませんか? : Name_Not_Found [sage] 2014/06/03(火) 12:22:52.65 ID:??? eval("1 + 2") : Name_Not_Found [sage] 2014/06/04(水) 10:59:59.30 ID:??? それだと「文字列が数式のみかどうか」を調べないといけないですが それはどうやりますか? : Name_Not_Found [sage] 2014/06/04(水) 11:09:41.20 ID:??? jqueryのaddClassで "hoge moge"など書くと複数クラスを適用できますが これは普通に使っていい機能なのでしょうか? : Name_Not_Found [sage] 2014/06/04(水) 11:12:01.31 ID:??? 英語リファレンスの方に書いてありました : Name_Not_Found [sage] 2014/06/04(水) 16:39:27.98 ID:??? 単に eval()でthrowされたエラーをcatch : Name_Not_Found [sage] 2014/06/04(水) 17:53:30.29 ID:??? 数式だけなら問題ありませんが コードが入力されたら実行されちゃいますよね : Name_Not_Found [sage] 2014/06/04(水) 20:11:53.62 ID:??? 実行された所で問題につながるかどうかは明らかにされてないがな ページ利用者が変な式を入力してページのふるまいがおかしくなるだけでは 問題とは言えないだろう : Name_Not_Found [sage] 2014/06/04(水) 21:18:01.26 ID:??? あきらかにされてなくてもナシなのは当たり前のことです 問題とは言えないだろうといいますが、大問題です : Name_Not_Found [sage] 2014/06/04(水) 21:20:15.38 ID:??? 事前に正規表現でチェックすれば? /^[\d\s+\-*\/]+$/.test(str) eval使いたくないとかもっと柔軟にしたいなら「数式 パーサ」で検索検索ゥ Googleくらい融通の効くライブラリは知らないや 自分で書くしかないんじゃね : Name_Not_Found [sage] 2014/06/04(水) 21:28:34.53 ID:??? evalでユーザーに任意のコード実行されて何が問題になるのか。全く問題無いだろ。 : Name_Not_Found [sage] 2014/06/04(水) 22:05:55.16 ID:??? まじで言っているのですか?evalが危険なのは常識だと思いますが : Name_Not_Found [sage] 2014/06/04(水) 22:26:01.99 ID:??? 次の様 evalを使うページが存在するとき、 ページ利用者にどのような実害が生じる可能性があるか、具体的に挙げなさい <!DOCTYPE html><html><head><meta charset="utf-8" /> <script> onload=function(){ var ele = document.getElementById('input'); ele.onchange = function(){ eval(ele.value); } } </script></head><body> <textarea id="input"></textarea> </body></html> : Name_Not_Found [sage] 2014/06/04(水) 22:32:11.84 ID:??? 内部のデータが壊れて整合性が狂う可能性あるじゃん : Name_Not_Found [sage] 2014/06/04(水) 22:41:33.29 ID:??? そんなの自己責任だろ。 ブックマークレット実行するとか JavaScriptデバッガで適当な命令 実行するのと何も変わらん。 : Name_Not_Found [sage] 2014/06/04(水) 22:44:45.93 ID:??? デバッガまでいじったら自己責任だが 表向き用意してるインターフェイスにそんな可能性があるのは問題 こんなの論争する価値もないほど自明のことだと思うが 世の中にはトンデモプログラマーがいるものだな : Name_Not_Found [sage] 2014/06/04(水) 23:05:11.57 ID:??? iframeでそのページを出して、 この画像の続きを見たければこの文字列をコピペしてください みたいに書いておくとか : Name_Not_Found [sage] 2014/06/08(日) 01:34:00.02 ID:??? lodashで、テンプレートにヘルパメソッドを渡してフィルタした値を出力する、ってやる時には <% print(helper(val)); %> ってやるしかないですか? <%= helper(val) %> みたいに書きたいのですが、これだとエラーになります : Name_Not_Found [sage] 2014/06/08(日) 07:13:06.90 ID:??? 「jqueryオブジェクト」同士をマージするにはどうやればいいですか? $.mergeは普通のオブジェクト用のようです : Name_Not_Found [sage] 2014/06/08(日) 07:37:57.11 ID:??? addでした : Name_Not_Found [sage] 2014/06/08(日) 13:26:55.29 ID:??? スマホで安定して動くファイルアップロードプラグインありますか? lagoscriptってサイトのjquery.upload-1.0.2.min.jsを使ってたんだけど iOS7だと動いたり動かなかったり、今はサイト自体が無くなってしまったようで : Name_Not_Found [sage] 2014/06/08(日) 17:05:34.55 ID:??? jQuery.merge のような関数を自分で追加するにはどうしたらいいですか? : Name_Not_Found [sage] 2014/06/11(水) 01:34:54.30 ID:??? 何のために追加するのか、 どんな機能を追加するのか? どうしてもjQueryプラグインにしないといけないのでない限り 追加しない方がいい。 グローバル変数やだ、じゃあjQueryに追加しちゃえ この程度の考えなら、やめた方がいい。 : Name_Not_Found [] 2014/06/11(水) 16:15:50.05 :Tk49AeqV JavaScript 3 で聞いても返事なかったので、こちらで伺います。 動的に追加されたaタグに対して、タップするにはどうすればいいですか? : Name_Not_Found [sage] 2014/06/11(水) 17:04:14.75 ID:??? 追加する方法を聞く質問に対してそんな答えはいりませんし もう分かったから別にいいです : Name_Not_Found [] 2014/06/11(水) 21:11:40.13 :TFmm7Due なにここ、殺伐としてるの? : Name_Not_Found [sage] 2014/06/11(水) 22:10:41.42 ID:??? 全然してませんよ 和気靄靄です : Name_Not_Found [sage] 2014/06/12(木) 00:12:49.56 ID:??? どこが和気靄々なの? : Name_Not_Found [sage] 2014/06/12(木) 02:09:45.18 ID:??? あなたに本質が見えてないだけだと思いますよ : Name_Not_Found [sage] 2014/06/12(木) 08:14:59.92 ID:??? 煽りばかりだね : Name_Not_Found [] 2014/06/12(木) 10:01:10.72 :rFNc0ptl click(); みたいに tap(); はないのかね。。 : Name_Not_Found [] 2014/06/12(木) 15:53:56.98 :GTltLDgb $('a').bind('touchstart', function() {alert('タッチ');}); : Name_Not_Found [] 2014/06/13(金) 00:38:04.04 :XeLi8Dzi ありがとう。 でも、それはタッチイベントを発生させるんじゃなくて、実際にタッチしたらalertで「タッチ」と出る感じじゃない? : Name_Not_Found [sage] 2014/06/13(金) 04:26:03.58 ID:??? jqueryで「親要素が指定した要素である」という条件で絞りこむにはどうしたらいいですか? : Name_Not_Found [sage] 2014/06/13(金) 09:19:07.03 ID:??? jQuery の click() もclickイベントを発火させるAPIじゃないよ : Name_Not_Found [] 2014/06/13(金) 11:04:16.78 :XeLi8Dzi そうだったのか。。 : Name_Not_Found [sage] 2014/06/13(金) 13:31:32.44 ID:??? ,91 HTMLInputElement.prototype.click と勘違いしたのかな ttp://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-2651361 それから誤解されやすいから求めるAPIのライブラリ名ぐらいは書いた方がいいと思うな jQuery では trigger() が該当するけど、jQuery 定義したイベントにしか対応しないから DOM L3 Events 互換ではないよ ttp://api.jquery.com/trigger/ : Name_Not_Found [sage] 2014/06/13(金) 14:19:35.19 ID:??? まあ elem.click が存在してたらそれ呼ぶけどね : Name_Not_Found [sage] 2014/06/13(金) 15:03:39.60 ID:??? 気が付かなかった 2.1.1のコード読んだけど、input[type=checkbox] だけ反応するみたいだね 一つの関数に複数機能を詰め込む仕様はわかりにくいなー : Name_Not_Found [sage] 2014/06/13(金) 15:32:25.68 ID:??? そこじゃなくて(いや、そこもだけど) > // Call a native DOM method on the target with the same name name as the event. > // Don't do default actions on window, that's where global variables be (#6170) ここのところかな。 > elem[ type ](); アンカーはクリックできないようにはなっているみたいだけれど : Name_Not_Found [sage] 2014/06/13(金) 18:01:43.31 ID:??? jqueryのval()などは「マッチした最初の要素で実行した結果」を返しますが 自分でこういうプラグインを作成する時は 単にthisに対しての実行結果を返すだけでいいのでしょうか? 実行集合の集合を返す場合と、単一の実行結果を返す場合の書き分けが良く分かりません : Name_Not_Found [sage] 2014/06/13(金) 18:02:27.87 ID:??? ×実行集合の集合 ○実行結果の集合 : Name_Not_Found [] 2014/06/13(金) 18:25:11.37 :PohclImA おお、丁寧にありがとう。 ブラウザでみたとき、実際にマウスを使ってクリックやタップしたのと同じ効果を求めてたんだけど、そういうのはないのだね。 : Name_Not_Found [sage] 2014/06/13(金) 20:36:47.98 ID:??? 96の件ですが、 集合の要素数のぶんだけプラグインのメソッドが呼ばれていると思いきや、 要素がいくつであれメソッドは一回しか呼ばれないんですね なんか色々勘違いしてたっぽいです : Name_Not_Found [sage] 2014/06/15(日) 00:01:59.50 ID:??? もうちょうっと詳しく描いてくれないとわかんない。 クリックされた要素が…とかなら if($(this).parents("親要素")[0]){ 処理; } : Name_Not_Found [sage] 2014/06/15(日) 00:03:44.30 ID:??? 一度jQueryプラグイン書いてみるといいですよ。 簡単ですから。 : Name_Not_Found [sage] 2014/06/15(日) 02:00:04.66 ID:??? jqueryでアニメーション中の要素を指定するには :animated を使いますが、この種のセレクタを否定形で書くことはできますか? #test:!animated みたいなイメージです : Name_Not_Found [sage] 2014/06/15(日) 02:18:29.67 ID:??? $('#test').not(':animate') とするしかないでしょうか? : Name_Not_Found [sage] 2014/06/15(日) 02:21:27.88 ID:??? :not() ってセレクタあるよ : Name_Not_Found [sage] 2014/06/15(日) 04:43:18.17 ID:??? jqueryで the set of matched elements 自体をまるっと入れ替えるにはどうしたらいいですか? addで追加はできるので、 クリアするメソッドがあればいいのですが : Name_Not_Found [sage] 2014/06/15(日) 12:34:48.73 ID:??? jQueryの話題はこっち jQuery ライブラリ 総合質問所 vol.4 ttp://peace.2ch.net/test/read.cgi/hp/1400313626/ : Name_Not_Found [sage] 2014/06/15(日) 12:42:47.57 ID:??? jQueryはここで問題ない : Name_Not_Found [sage] 2014/06/15(日) 12:48:58.14 ID:??? 別にここでいいって書いてあるが、 専用のスレのほうが良い答えが得られるって話。 : Name_Not_Found [sage] 2014/06/15(日) 14:20:26.05 ID:??? ねーよww 馬鹿すぎワロタ : Name_Not_Found [sage] 2014/06/15(日) 15:38:11.35 ID:??? .slice() かな .eq() で範囲外を指定するのでもいけそうだけど : Name_Not_Found [sage] 2014/06/15(日) 15:54:47.10 ID:??? 副作用的にクリアする方法はいくつかありそうですね ありがとうございます : Name_Not_Found [sage] 2014/06/15(日) 17:47:16.69 ID:??? validateプラグインの質問ですが 必須チェックはサブミット直前のみ、それのチェック以外はリアルタイム といったようにバリデーションの種類ごとに タイミングを変えることは可能でしょうか? : Name_Not_Found [sage] 2014/06/15(日) 21:09:12.05 ID:??? jQueryのHTML読み込みについて質問です .loadやその中の.ajaxで、ローカルHTMLに別のローカルHTML(同一ディレクトリパス下)を読み込む事が、各ブラウザの新しめのバージョンでは出来なくなりました ブラウザが「XSS対策のため、別ドメインからは読み込めない」よう制限を掛けているそうですが、同一階層のローカルファイルがこれに引っ掛かるのは、なぜですか? サーバに置けば、動くそうです : Name_Not_Found [sage] 2014/06/15(日) 22:11:28.29 ID:??? ブラウザが昔より高機能になってる一方で ディレクトリパス何それ?な一般利用者は相変わらず多いだろうから 同一階層でも別ドメイン扱いにすることにしたのだろう : Name_Not_Found [sage] 2014/06/15(日) 22:23:26.75 ID:??? ローカルがfileスキームを指しているのならHTTP通信ではないからです ttp://localhost/ の環境を構築すればローカルテスト可能です : Name_Not_Found [sage] 2014/06/15(日) 22:43:45.64 ID:??? ブラウザが、ですか? XMLHttpRequestとして扱えなくなったってことですかね 用途が、ユーザに納品するHTMLモックアップでの話(そして読み込みの使途は、メニューdivを各HTMLにハードコーディングしたくない、とか)なので、一般の人のPCでHTMLファイルとして開けないとまずいんですよね IEに関しては当面、UA情報を制御するmetaタグでごまかせそうなんですが、数年後とかどうしようと思います WSHのFileStreamObjectなら代替になるのかなぁ… : Name_Not_Found [sage] 2014/06/15(日) 22:56:45.24 ID:??? たとえば完了をコード200で見てたらHTTP以外じゃダメだよね XMLHttpRequestを直接扱ってみては? : Name_Not_Found [sage] 2014/06/15(日) 23:50:31.10 ID:??? そういうことですか selectivizr.jsなんかはネイティブコードですが、同じようにstatusが200の時だけ通してますね 自作もいとわない方向なので、XHRの使い方から調べてみます みなさん、ありがとうございました : Name_Not_Found [sage] 2014/06/16(月) 04:41:43.22 ID:??? ttp://jsbin.com/devobosa/1/edit bootstrapでpopoverのテストがしたくて ttp://www.wivern.com/twitterbootstrap6.html ここのサイトのコードをコピペしましたが クリックしても何も起きません 何が駄目なんでしょうか? : Name_Not_Found [sage] 2014/06/16(月) 04:46:08.51 ID:??? jsbinとの相性が悪いのでしょうか? : Name_Not_Found [sage] 2014/06/16(月) 05:01:01.44 ID:??? と思ったけどテスト用サーバで実行しても何も起きません : Name_Not_Found [sage] 2014/06/16(月) 08:19:41.04 ID:??? いろいろサンプルを見て $('.popover-test').popover(); を追加したら表示されるようになりました 自動的に追加されるんじゃなかったのでしょうか? : Name_Not_Found [sage] 2014/06/16(月) 11:05:39.05 ID:??? あなたが何を疑問に思っているのかわからない 使い方にも $('#example').popover(options) とあるし、何も問題はないように見える ttp://www.wivern.com/twitterbootstrap6.html#608popovers : Name_Not_Found [sage] 2014/06/16(月) 12:01:20.32 ID:??? このライブラリを使おうとテストしているのですが ttp://bassistance.de/jquery-plugins/jquery-plugin-treeview/ 動的にノードを追加したときに?や|などの記号を更新したいのですが $("#browser").treeview({ add: branches }); や $("#browser").treeview({ remove: branches }); はあるのですが更新みたいなものがなく追加したらひとつ上のノードは 記号が変わって欲しいのですが変わりません。 どうしたら更新できるのでしょうか。 : Name_Not_Found [sage] 2014/06/16(月) 14:27:09.86 ID:??? bootstrapではdropdownはhtmlを書くだけで作成されるので popoverも同様な動作をすると思ったんです 微妙に動的にしなければいけない必要性がよく分かりません : Name_Not_Found [sage] 2014/06/16(月) 17:17:01.78 ID:??? 設計思想は作者以外にわからないので、作者に直接尋ねるしかないかと : Name_Not_Found [sage] 2014/06/16(月) 18:04:44.86 ID:??? それは少し違うのでは? プログラムは合理性に基づいて設計されるのですから、 他人が理由を言い当てることは十分できるはずです むろん良く出来たプログラムに限りますが : Name_Not_Found [sage] 2014/06/16(月) 21:48:51.46 ID:??? ホイールスクロールをしたら、アンカーごとにページが丸ごと移動するjqueryスクリプトってありますかね? 今mousewheel.jsで横スクロールサイトを作ってるんですが、アンカーによる移動をそのままスクロールでも実装したいと思ってます。 (下にスクロールしたら右にずずっと移動するのではなく、すぐに隣のセクションに移るような感じで) 欲を言えばある一定量のしきい値までスクロールがされたら一気に移動するような感じにしたいとは考えているのですが、ひとまずは以上のようなものを探しています。 誰か知ってる人居ませんかね? : Name_Not_Found [] 2014/06/17(火) 00:04:25.46 :xLIek/UC ■質問です 動的に生成したidにページ内リンクをしたいのですが、IE10が効きません。 ページA( ttp://hoge/A/ )内のテキストリンク(とび先: ttp://hoge/B/#q4 )から ページB( ttp://hoge/B/ )に遷移してきた時にページ内リンクで、#q4の位置に 表示されるようにしたいのですが、 idをjQueryで振らなければなりません。 それは出来たのですが、IE10だけ、#b4の位置に表示されず、アンカーが効きません。 jQueryでidが振られるタイミングの問題でしょうか? $(function(){ $(".faq-question").each(function (i) { i = i+1; $(this).prepend('<span id="q'+i+'" class="q_number">Q'+i+'</span>'); }); }); 動的idでページ内リンクをIE10で解決できる方法を教えてください : Name_Not_Found [sage] 2014/06/17(火) 00:20:23.32 ID:??? では、あなたが考えてみて下さい : Name_Not_Found [sage] 2014/06/17(火) 01:16:32.55 ID:??? idを振ったあとにlocation.hashでジャンプしてる感じ? : Name_Not_Found [] 2014/06/17(火) 13:50:21.61 :0pnqsA+u jQueryでボタンをクリックするとsubmitが実行されるようにしています。 $('.btn').click(function(){ document.form1.submit(); }); この時、「送信したくない要素」がある場合、どうしたらいいのでしょうか? 今は、$(inputのID).remove(); としているのですが、 これだとsubmit前に画面から消えるので、他の方法が無いか探しています。 : Name_Not_Found [sage] 2014/06/17(火) 14:01:40.90 ID:??? 試してないけど name属性消すのは? : Name_Not_Found [sage] 2014/06/17(火) 14:01:43.52 ID:??? 名前をでたらめにすればいいよ : Name_Not_Found [sage] 2014/06/17(火) 14:49:32.27 ID:??? 要素にdisabledを与えれば? : 132 [sage] 2014/06/17(火) 17:19:21.36 ID:??? この方法にします。みなさんありがとうございました。 : Name_Not_Found [sage] 2014/06/17(火) 20:55:11.61 ID:??? ttp://klutche.org/archives/536/ こういうのを参考にscrollTop()やoffset().topをscrollLeft()やoffset().leftに変えれば実現出来ないかな。 動きに関してはeasingプラグインを入れるか、 ttp://www.softel.co.jp/blogs/tech/archives/4282 こういうの参考にして自作する : Name_Not_Found [sage] 2014/06/17(火) 21:00:43.01 ID:??? tooltipで実装してるからでは? : 129 [] 2014/06/17(火) 22:37:52.04 :xLIek/UC いえ、遷移元のページでは、静的なリンクです。 普通のHTMLで記述してます <a href=" ttp://hoge/B/#q4">#q4 へのリンク</a> : 129 [sage] 2014/06/17(火) 22:43:05.05 ID:??? いいえ、普通のHTMLのaタグです : Name_Not_Found [sage] 2014/06/17(火) 23:03:55.02 ID:??? 遷移してからJavaScriptが実行されるのだから上手く動くわけがない 動いているブラウザは、たまたま間に合っているに過ぎない の方法で原理的には解決できる : 141 [sage] 2014/06/17(火) 23:06:48.70 ID:??? 本題から若干逸れるが、他からアンカー目標となるコンテンツをJavaScriptで生成するのはあまりよろしくない 出来るだけサーバサイドで動的出力するのが望ましい : Name_Not_Found [sage] 2014/06/18(水) 00:14:53.13 ID:??? 別に問題ないでしょw もし問題がある場合が明確になったら その時やっと話を聞くことにするよ。 : Name_Not_Found [sage] 2014/06/18(水) 09:53:59.63 ID:??? 「遷移してからJavaScriptが実行されるのだから上手く動くわけがない」という明確な理由は既に指摘したはずだが の方法では一度、遷移した後にもう一度遷移する可能性があり、最適な対策とはいえない しかも、JavaScript無効の環境ではリンク先にジャンプできない それから、これは質問者が判断すべき事で外野がとやかくいうべきじゃない : Name_Not_Found [sage] 2014/06/18(水) 15:41:55.79 ID:??? すみません、間違って重複スレ(ttp://peace.2ch.net/test/read.cgi/hp/1400313626/ ) に同じ質問をしてしまいましたが、再掲させていただきます。 (若干コードが異なります。また意図的なマルチではありませんのでご容赦お願いします) (【CSS】 #wrapper { position: relative; width: 500px; height: 500px; } #wrapper div { position: absolute; width: 500px height: 500px; display: none; } #wrapper div:nth-child(1) { background-image: url(img1.jpg); } #wrapper div:nth-child(2) { background-image: url(img2.jpg); } ・・・・ #wrapper div:nth-child(20) { background-image: url(img20.jpg); } 【html】 <div id="wrapper"><!-- inner divs --><div></div><div></div>・・・・・<!-- inner divs end --></div><!-- #wrapper end --> <!-- #wrapperの内側に背景表示用のdivが20個あります。imgタグでないのは、今後background-size:coverなどを適用させる予定のため --> 【jQuery】 $wrap = $('#wrapper'); $elem = $wrap.find('div'); var animList = { //最初全てのdivが重なって表示されている状態から、0.5秒間隔で一つ目のdivから20個目まで順々に消す処理をしています。 no1: function() { return $elem.show().each(function(i){ $(this).delay((20 - i) * 50).fadeOut(0); })}, no2: function(){ return....(some animation function) } } //アニメーションを同時再生させないために実行順序を登録。 $(window).on('load',function(){ var order = $.Deferred(function(dfd){ dfd.then(animList.no1).then(animList.no2)}).resolve(); }); 上記コードで高速スライドショーみたいなのを実装したのですが MAC firefox最新版だと期待通りに動くものの、MAC chrome最新版だと飛び飛びになってしまいます(他ブラウザでは未検証) おそらく処理が追いついてないのでしょうが、飛び飛びにならないようにするにはどうしたらいいでしょうか? 以上、ご回答のほどよろしくお願いします。 : Name_Not_Found [sage] 2014/06/20(金) 03:20:22.58 ID:??? .delay((20 - i) * 50) これだと 0.05秒間隔になるんじゃないの? あと .delay() は内部的にはsetTimeout() を使ってて、 時間が来たら次のqueueをってなってるんだけど、 のやり方だと20個のタイマーを同時に動かしていることになるから タイマーの短い時間での精度が悪いとばらばらになるんではないかな 一つのタイマーをつかって順々に処理させるほうがいいのでは? それなら少々遅れようとも飛ばされることはないのでないかと予想 (ここまで全然検証してないけど) : Name_Not_Found [sage] 2014/06/20(金) 12:21:17.61 ID:??? 0.05秒であっています。のコメントが間違ってました setTimeoutの方向で少し模索してみます ちなみにeachをつかわずにべた書きで animList.no1 〜 no.20まで関数定義して誤摩化そうとしてみましたが 激遅で使い物になりませんでした・・・ : Name_Not_Found [sage] 2014/06/20(金) 15:22:51.22 ID:??? ttp://peace.2ch.net/test/read.cgi/hp/1399764134/742 より引用。 > 742 名前:Name_Not_Found[sage] 投稿日:2014/06/20(金) 14:49:43.42 ID:??? > jQueryのcss()などで要素のcssプロパティを追加する場合 > ブラウザ未対応プロパティまたは値が不正で無視された事を検知するにはどうすればいいでしょうか? DOM APIで判定する。 'propertyName' in element.style // プロパティが存在する時は true : Name_Not_Found [sage] 2014/06/21(土) 00:21:10.87 ID:??? WEB制作板では、このスレが一番スキル高い人多いね。 他のスレは回答者クソばっかだ : Name_Not_Found [sage] 2014/06/21(土) 00:49:49.17 ID:??? JavaScriptスレにもスキル高い人はいるし、お世話になった ただ、最近の質問は低レベルすぎてその人達はあまり出てこないけどね 潜在的にはここにいる人と同じ層なはず : Name_Not_Found [sage] 2014/06/21(土) 17:25:45.76 ID:??? 画像を切り替えてパラパラマンガのようにアニメーションさせたいのであれば CSSスプライトな背景画像を動かす方がリクエストも少なくなるしなめらかにできるような・・・・ ------------------------------------------------------------ 【html】 <div class="image"></div> 【css】 .image{ width: 310px; height: 310px; background: url( ttps://dl.dropboxusercontent.com/u/34189438/2ch/img.png); background-position: -2800px; } 【js】 $(window).load(function() { for(var i = 0; i < 9; i++){ setTimeout(switchImg, 50 * i); } function switchImg(){ var bgposi = parseInt($('.image').css('background-position')); $('.image').css('background-position', bgposi+310); } }); ------------------------------------------------------------ CSSのanimationのほうがさらに軽そうだけど。 ttp://codepen.io/jascha/details/sIgAo 的外れな回答だったらすんません。 : Name_Not_Found [sage] 2014/06/21(土) 17:57:28.54 ID:??? jqueryでデレゲートする時、 具体的なDOMを渡しても、同種のDOMが反応します <div id="test"></div> <div id="test1"></div> $(document).on('click',document.getElementById('test'),function(e){ console.log(e.target.id); }) これでtest1でも反応します。何故でしょうか? testにだけ反応させたい時はどうしたらいいですか? : Name_Not_Found [sage] 2014/06/21(土) 18:05:58.97 ID:??? document.getElementById('test') を呼び出した時、対象ノードを取得できてないんじゃない? : Name_Not_Found [sage] 2014/06/21(土) 18:09:21.67 ID:??? ありがとうございます 取得は出来ていますが、デレゲートに失敗しているようで div以外でも反応します どうもdomをセレクタにすることは出来ないようです : Name_Not_Found [sage] 2014/06/21(土) 18:24:32.46 ID:??? ドキュメントにも selector しか書いてないね ドキュメントを読む癖をつけるといいよ ttp://api.jquery.com/on/ : Name_Not_Found [sage] 2014/06/21(土) 20:34:30.57 ID:??? そもそも具体的なDOMが特定できてるんなら、delegateを使う意味というか意義がないんじゃね? : Name_Not_Found [sage] 2014/06/21(土) 21:02:36.64 ID:??? 確かに : Name_Not_Found [sage] 2014/06/21(土) 22:05:35.46 ID:??? デレゲートには処理コストを下げるという意味もある : Name_Not_Found [sage] 2014/06/21(土) 22:17:45.53 ID:??? どの段階の? : Name_Not_Found [sage] 2014/06/21(土) 22:29:47.48 ID:??? をjQueryを使わずに書けば無意味といわれる理由がわかると思う : Name_Not_Found [sage] 2014/06/21(土) 23:03:05.89 ID:??? 言われてみれば、対象が単独の場合はデレゲートしてもコスト下がらないですね ありがとうございました : Name_Not_Found [sage] 2014/06/21(土) 23:10:46.74 ID:??? あえてするんなら、そのままの構文で event.data にそのDOMが渡されてくるはずだから、 そこで違ったら return …かな(検証してない) : Name_Not_Found [sage] 2014/06/22(日) 00:53:30.88 ID:??? 無意味なのは「要素ノードをキャッシュしようとしていたから」であってdelegeteが無駄な訳じゃないよ 単一ノードでもdocumentに付け外しを繰り返しても検出できるメリットがある キャッシュしたら参照比較なのでこのメリットを享受できない : Name_Not_Found [sage] 2014/06/22(日) 01:10:09.26 ID:??? ちょっと意味が分かりません 例を示してもらえますか? : Name_Not_Found [sage] 2014/06/22(日) 07:32:25.28 ID:??? jQuery(document).on('click','#test',function (e) { console.log(e.target.id); }); 上記コードは意味があるが、は(正常動作したとして)無意味 : Name_Not_Found [] 2014/06/24(火) 18:31:43.19 :EdfWiaWp すごく初歩的なことだと思うのですが、質問させてください。 jQuery(1.7.2) の animate() の実行前に処理をしたいものがあるのですが、うまく行きません。 # jQueryというよりは javascriptの書き方だと思うのでここで質問させていただきます。 this.info( "log 1" ); $(#hoge).animate(properties,options); this.info( "log 2" ); $(#hoge).animate(properties,options); とすると、this.info() が先に全部動いてしまいます。 おそらくメソッドチェーン?というのを使うのだと思うのですが、どのようにすればよいでしょうか。 animate()のコールバックを使うとanimate()が実行した後にthis.info()が動くのを確認したのですが、動く前にthis.info()を実行したいです。 : Name_Not_Found [sage] 2014/06/24(火) 18:45:09.95 ID:??? 全てanimate前にconsole出力されるはずたけど、非同期処理を理解してないのでは? : Name_Not_Found [] 2014/06/24(火) 19:04:53.07 :EdfWiaWp 補足します。 1. this.info( "log 1" ); 2. $(#hoge).animate(properties,options); 3. this.info( "log 2" ); 4. $(#hoge).animate(properties,options); と番号を振った時、1, 3, 2, 4 と動きます。 そうではなく、1, 2, 3, 4 と動かしたいです。 はい、あまり非同期処理が理解できていないと思っています。概念はなんとなくつかめているのですが、うまく扱えていません。 これは、メソッドチェーンを使えば1,2,3,4といった順番で動くのではないかと思っているのですが、どのようにすればよいでしょうか。 : Name_Not_Found [sage] 2014/06/24(火) 19:12:43.47 ID:??? jQueryのアニメーションはキューに積まれて、タイマーで逐次実行されるんだわ .queue() を調べてみて callback関数渡す構文のやつ : Name_Not_Found [sage] 2014/06/24(火) 19:36:08.09 ID:??? その手順だと 2. が終った後に 3. が始まるから動作が変化するけど、そこはいいの? : Name_Not_Found [] 2014/06/24(火) 19:48:47.97 :EdfWiaWp ありがとうございます。 animate()に限ったことではなく他の処理を書く場合にも陥りそうなので、できれば汎用的な書き方を知りたいと思っています。 はい、問題ありません。 : Name_Not_Found [sage] 2014/06/24(火) 23:12:46.36 ID:??? アニメーションが実際に実行される直前にイベントが発行されるだろうから そのハンドラの中で 1 や 3 を呼び出す 具体的には ttp://api.jquery.com/animate/ を読めばわかるが .animate( properties, options ) に渡す options オブジェクトの strat ハンドラに 1, 3 を入れるといいだろう : Name_Not_Found [sage] 2014/06/25(水) 00:09:14.17 ID:??? >できれば汎用的な書き方 >172 に補足すると、非同期に実行される類いの処理は たいていの場合、その種のイベントが発行されるようになっている ES6 では promise が js ネイティブになる。 そのときにはコードも汎用的な書き方が可能になるだろう : Name_Not_Found [] 2014/06/25(水) 03:43:24.71 :fC2Iq/KP ありがとうございます。 animateのoptionsのstartですが、jQuery1.8から利用できるようでした。 jQuery1.7.2という縛りがあるため利用できなさそうです。 method1().method2().method3(); といったように利用したいのですが、都度都度functionを定義するのは面倒なのでこれを無名関数で行うにはどのようにすればよいでしょうか。 $(function(){ (function(){ alert(1); return this; }).(function(){alert(2);return this;}); }); syntax error ですが、こういった書き方ができればと思っています。 : 169 [sage] 2014/06/25(水) 05:13:45.47 ID:??? やりたいことは .queue() だと思ったんだけど違うのか? .animate()と.animate()との間に割り込めればいいんだよね : 169 [sage] 2014/06/25(水) 05:44:58.04 ID:??? あ、汎用的ってのは .animate()以外の.ajax()などの非同期処理もってことか? Deferred を使って、一つ目の.animate() が完了してから次のを設定 とするしか無いのでは .ajax() なんかもその中に入れられるし animation関連はキュー処理だからDeferred機構とはちょっと違うんだよね 割り込もうとしたらキューに積むか か どっちにしろjQueryのアニメーション機能に特化しちゃうね : Name_Not_Found [] 2014/06/25(水) 06:44:46.74 :fC2Iq/KP ありがとうございます。 ttp://s3pw.com/qrefy/collectdeferred/ ここにドンピシャのものがありました。 あまりjavascriptに慣れていないので、とても奇妙な書き方をしているかもしれませんが、 var hoge = function(){}; hoge.prototype = { anime1:function(){ // animate }, anime2:function(){ // animate }, info:function(msg){ console.log("info:"+msg); } }; のように書いておき、 $.when() .then(function(){ obj = new hoge(); obj.info("anime1"); }).then(function(){ obj.anime1(); }).then(function(){ obj.info("anime2"); }).then(function(){ obj.anime2(); }); といったような書き方ができればと思っています。 // ↑望んだ通りに動かないですが。 s3pw.com にあるように animate() のオブジェクトを返せばいいのかもしれないですが、animate() 以外にも obj が持つ他のメソッドも実行したいため、そのようにかけませんでした。 どのように解決すべきでしょうか。 : Name_Not_Found [sage] 2014/06/26(木) 13:19:53.41 ID:??? jqueryでハンドラを付ける時、 詳細な指定をしている方を先に実行して欲しいです $(document).on('click','ul[data-id=moge]',〜 と $(document).on('click','ul',〜 では、上の方を先に実行して欲しいです 詳細なものほど優先するのは、CSSの決定同様に合理的動作だと思いますが、 そういう調整は内部でなされているのでしょうか? : Name_Not_Found [sage] 2014/06/26(木) 13:23:07.62 ID:??? 試したところ、されてませんでした : Name_Not_Found [] 2014/06/26(木) 14:27:44.09 :c6xjl0Y9 jqueryで特定の要素がある時は実行したいのですが、どう書けばいいのでしょうか? イメージとしては if (指定IDを持つ要素が存在する) { 〜存在する場合の処理〜 } else { 〜存在しない場合の処理〜 } という事がしたいです。 if ($('#hoge')) では無理でした。 : Name_Not_Found [sage] 2014/06/26(木) 15:44:46.31 ID:??? こいつ何回同じ質問すんだよw : Name_Not_Found [sage] 2014/06/26(木) 19:08:46.43 ID:??? 自分の満足できる答えにならないから 悔しいんだろw 関数型言語風のコードは美しいからね。 それを認めたくないんだろう。 : Name_Not_Found [sage] 2014/06/26(木) 19:40:22.72 ID:??? 関数言語推しの人も同程度にうざい : Name_Not_Found [sage] 2014/06/26(木) 20:07:33.48 ID:??? if ($('.hoge').length ){ } else { } でOK : Name_Not_Found [sage] 2014/06/26(木) 22:42:41.67 ID:??? stopPropagation と stopImmediatePropagation の違いを分かりやすく説明して下さい : Name_Not_Found [sage] 2014/06/27(金) 00:48:00.92 ID:??? Propagation を stop するか Immediate に stop するか の違いがある : Name_Not_Found [sage] 2014/06/27(金) 01:00:56.16 ID:??? immediateじゃない場合はどこに伝播するんです? : Name_Not_Found [sage] 2014/06/27(金) 01:31:42.89 ID:??? お隣さん : 180 [sage] 2014/06/27(金) 01:44:41.29 ID:??? この方法で出来ました。ありがとうございました。 : Name_Not_Found [sage] 2014/06/27(金) 02:18:47.53 ID:??? よく分からないなあ immediateじゃないstopはどこへの伝播を止めてるんです? : Name_Not_Found [sage] 2014/06/27(金) 12:02:09.63 ID:??? 公式文書を読んでわからなければ諦める ttp://api.jquery.com/event.stopimmediatepropagation/ : Name_Not_Found [sage] 2014/06/27(金) 16:54:54.43 ID:??? ありがとうございます ・stopPropagation、stopImmediatePropagation、両方ともバブルアップを止める ・stopPropagationは、その要素に対する同種のイベントは止めない ・stopImmediatePropagationは、その要素に対する同種のイベントも止める 要約するとこういうことでしょうか : Name_Not_Found [sage] 2014/06/27(金) 17:06:30.23 ID:??? javascriptを使ってブラウザで動くパズルゲームを作りたいのですが簡潔にかけて初心者でも理解しやすいようなライブラリありませんか? PC用にする予定なのでスマホに関してはどうでもいいです : Name_Not_Found [sage] 2014/06/28(土) 02:40:16.53 ID:??? ttp://toro.2ch.net/test/read.cgi/gamedev/1048171505/ : Name_Not_Found [sage] 2014/06/28(土) 03:36:25.11 ID:??? jqueryのoffset()はウインドウ上の座標つまりウインドウ座標が返ってくるようです。 何故メソッド名がoffsetなんですか? オフセット座標って親要素を基準にした座標のことじゃないんですか? : Name_Not_Found [sage] 2014/06/29(日) 09:47:25.49 ID:??? 英語でお願いします : Name_Not_Found [sage] 2014/06/29(日) 17:48:31.09 ID:??? 基準点が親要素であるとか、オフセットの定義に含まれて無い気がするけど。 : Name_Not_Found [sage] 2014/06/30(月) 00:36:40.03 ID:??? offset()で取得されるのがドキュメント座標ならまだ分かりますが クライアント座標というのは違和感があります : Name_Not_Found [sage] 2014/07/04(金) 15:57:54.70 ID:??? 複数のノードを選択できるツリービューってありますか? : Name_Not_Found [sage] 2014/07/04(金) 16:09:53.81 ID:??? jquery-cookieの作者はなぜ$.cookie()に宣言したのだと思いますか?ただのfoocookie()とかじゃダメだったんでしょうか? jquery-cookieの機能はjqueryと依存関係があるのでしょうか? : Name_Not_Found [sage] 2014/07/04(金) 20:03:30.75 ID:??? なぜグローバル空間を汚す実装が良いと思ったのですか? 既存のグローバル変数との競合を考慮しなかったのでしょうか? : Name_Not_Found [sage] 2014/07/04(金) 22:36:02.54 ID:??? 少し前まで「jQuery plugin」がバズワードだったから なんでもかんでも$に定義するならグローバル変数と大差なし ユニークな名前のグローバル変数を定義した方がマシ : sage [sage] 2014/07/04(金) 23:45:15.06 ID:??? スクロールエリアでスワイプのイベントをとらえたいのですが どのようにすればできるでしょうか。 下記のようなソースではできませんでした。 <!DOCTYPE html> <html> <head> <title>My Page</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href=" ttp://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" /> <script type="text/javascript" src=" ttp://code.jquery.com/jquery-1.7.1.min.js"></script> <script type="text/javascript" src=" ttp://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#scrollswipe').bind('swipe', function(){ alert("swipe"); }); }); </script> </head> <body> <div id="scrollswipe" style="width:200px; height:200px; overflow:scroll;"> <h1>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</h1> <h1>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</h1> <h1>cccccccccccccccccccccccccccccccccccccccccccc</h1> <h1>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</h1> <h1>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</h1> </div> </body> </html> : Name_Not_Found [sage] 2014/07/04(金) 23:48:49.20 ID:??? まず、bindは使うな。これは古いメソッドだ。 : Name_Not_Found [sage] 2014/07/04(金) 23:51:29.93 ID:??? $(document).ready(function(){ これは冗長 $(function(){ こう書けば良い。 あとHTML5なら type="text/javascript" は不要。 : Name_Not_Found [sage] 2014/07/06(日) 21:57:15.64 ID:??? バージョンを最新の1.4.3にして、 <script src=" ttp://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.js"></script> $(document).ready(function(){ の次の行あたりに $.event.special.swipe.scrollSupressionThreshold = 10; を追加。 : Name_Not_Found [] 2014/07/09(水) 19:00:23.22 :lmGHLPpY jquery1.7.2で動的に追加したformをsubmit();したいのですが方法ありますか? : Name_Not_Found [sage] 2014/07/10(木) 00:18:07.88 ID:??? idとかないの : Name_Not_Found [sage] 2014/07/10(木) 00:28:29.28 ID:??? var frm="<form id=\"foo\"></form>"; $("hoge").append($(frm).clone(true)); $("#foo").submit(); : Name_Not_Found [] 2014/07/10(木) 06:54:04.71 :cODa6UYa ありがとうございます! : Name_Not_Found [sage] 2014/07/10(木) 16:47:59.06 ID:??? onscrollイベントの中で、スクロールした座標軸の種類を知ることは出来ないのでしょうか? 座標軸と、移動量を知りたいのですが : Name_Not_Found [sage] 2014/07/10(木) 16:48:28.62 ID:??? ↑jqueryの話です : Name_Not_Found [sage] 2014/07/10(木) 16:54:02.83 ID:??? onscrollイベントのたびに座標をcheckして自分で検出するしかないでしょうか? : Name_Not_Found [sage] 2014/07/10(木) 18:56:00.09 ID:??? そうですね : Name_Not_Found [sage] 2014/07/10(木) 19:17:18.70 ID:??? そうですか ありがとうございました : Name_Not_Found [sage] 2014/07/10(木) 22:43:47.52 ID:??? IDいらんだろ? 余計なコード書くなよ : Name_Not_Found [sage] 2014/07/10(木) 22:44:33.14 ID:??? はcloneもいらんし。 なんでこう無駄なコード書くかなー。 : Name_Not_Found [sage] 2014/07/17(木) 16:29:02.00 ID:??? idがabcのtrタグ内にある、nameが_defで終わるタグをリストしたい。 一番スマートな方法は? <tr id="abc"> <td><input name="fas_def" /></td> <td><input name="sec_def" /></td> <td><input name="thr" /></td> <td><input name="fou_def" /></td> <td><input name="fif" /></td> <td><input name="six_def" /></td> </tr> : Name_Not_Found [sage] 2014/07/17(木) 16:30:01.27 ID:??? まちがえた! nameが_defで終わるタグをリストしたい。 ↓ nameが_defで終わるnameをリストしたい。 : Name_Not_Found [sage] 2014/07/17(木) 16:32:01.20 ID:??? こんな感じの配列がゲットしたい! @q = ('fas_def','sec_def','fou_def','six_def') : Name_Not_Found [sage] 2014/07/17(木) 17:24:22.18 ID:??? querySelectorAll : Name_Not_Found [sage] 2014/07/17(木) 19:23:34.04 ID:??? jQuery初心者で勉強中の者です。 ttp://calie.jp/beashow/index.html のサイトのような 画像を読み込んだら自動で画像がフェードインしエフェクトが動く動きを実現するには jquery.inview.jsとjquery.easing.1.3.js が必要だということはわかったのですが、どのように記述すれば実現できるのかがわかりません。 画像をよみこんでフェードインさせた画像を左右上下にエフェクトをかけて表示させる方法を詳しい方ご教授いただけないでしょうか 画像をフェードインさせるところまでは一人でできました。→ ttp://aruearoe.com/ : Name_Not_Found [sage] 2014/07/20(日) 09:48:52.96 ID:??? jqueryで プラグインで追加されたメソッドの一覧を知る方法ありますか? : Name_Not_Found [sage] 2014/07/20(日) 13:46:44.58 ID:??? こちらへどうぞ Webサイト制作初心者用質問スレ part240 ttp://peace.2ch.net/test/read.cgi/hp/1400371843/ : Name_Not_Found [sage] 2014/07/20(日) 13:58:20.97 ID:??? じゃない。 JavaScriptの話題はこっち + JavaScript の質問用スレッド vol.117 + ttp://peace.2ch.net/test/read.cgi/hp/1403330196/ : Name_Not_Found [sage] 2014/07/20(日) 14:32:20.76 ID:??? 意味不明の誘導だな : Name_Not_Found [] 2014/07/23(水) 10:25:45.48 :71RmFEbX セレクターでどうしても詰まってしまっている問題があります。 <h3>タイトル1</h3> <p>aaaaaa</p> <p>aaaaaa</p> <p>aaaaaa</p> <h3>タイトル2</h3> <p>aaaaaa</p> <p>aaaaaa</p> <p>aaaaaa</p> のようなHTMLがあります。ここで<h3>をクリック時にその下の<p>をすべてhide() したいとおもっているのですが、クリックされたh3の下にあるpを全てセレクトする方法が わかりません。 Jquery UIのアコーディオンも確かめてみたのですが、今回の仕様には合わないので 自作でと、思っております。よろしくお願いいたします。 : Name_Not_Found [sage] 2014/07/23(水) 10:36:43.19 ID:??? まず、クリックされたh3をセレクトできないと始まらないが 「クリックされた要素」はどうやってセレクトする? その上で p すべてとは、 pの個数は決まってるのか? pは連続しているのか? : 227 [sage] 2014/07/23(水) 10:42:42.92 ID:??? ありがとうございます。 pの個数は決まっていません。 pは連続しています。つまりh3の下にはpが連続して出現し、 またh3が来ます。 隠したいのは次のh3が出現するまでp全てということです。 クリックされたh3はクリックイベントの中の$(this)で取得しようと 思っていましたが、ダメでしょうか? : 227 [sage] 2014/07/23(水) 11:32:58.53 ID:??? なんとか自己解決しました。 クリックされたh3を$(this)でとりまして、 var next = $(this).nextAll(); でh3以降の要素をすべて取得します。 nextをeach() で回して、p だったら hide() して、h3が出現したら return falseでeachを出ます。 これで狙った挙動を実現できました。 やりたいことをここに書いていたら、アイデアが出ました。 ありがとうございます。 : Name_Not_Found [sage] 2014/07/23(水) 11:55:09.49 ID:??? h3とp要素をsectionやdivでかこってしまえばもっと簡単に書けるし早くなるんじゃね? と思ったがこういうのは余計なお世話か : Name_Not_Found [sage] 2014/07/23(水) 12:12:12.44 ID:??? 普通はそれが正しい。 : 227 [sage] 2014/07/23(水) 13:29:41.38 ID:??? おっしゃる通りなのですが、今回別ソースから動的にHTMLを引っ張ってきて、 それに対してアコーディオン効果を付けたい、という要望でして。 元のHTMLはむやみに触れない状況だったのです。 せめて連続するp要素がdivで囲われていれば、一発だったのですが。 : Name_Not_Found [] 2014/07/25(金) 01:04:04.03 :5bj2BcEL ■質問です■ $(document).ready(function(){ $('.aa').each(function () { $(this).prepend('bb'); }); }); 上記で要素追加.prepend();しているのですが、 phpのページ送り(URL、パラメーターは変更なし)のボタンをクリックすると 動的に内容が変更された後に .prepend();の効果が外れてしまいます。 $('.aa')は動的変更後も存在します。 $(document).ready(function(){なので当然かとは思いますが、 phpで動的変化された後にもjQueryの効果を読ませるにはどうすれば可能でしょうか。 : Name_Not_Found [sage] 2014/07/25(金) 10:24:41.48 ID:??? 動的に内容が変更されるイベントにフックして $(this).prepend('bb'); すればいいだけだと思うけど : 235 [sage] 2014/07/25(金) 10:38:57.22 ID:??? this じゃ無理か イベントを貼り付けた要素にも依るが、event.target.ownerDocument あたりか > phpのページ送り(URL、パラメーターは変更なし)のボタンをクリックすると 動的変更でもURL、パラメータは変更すべきでは? : Name_Not_Found [sage] 2014/07/25(金) 13:57:06.62 ID:??? 答えじゃないが、コードが冗長だよ。無駄が多すぎ。 > $(document).ready(function(){ > $('.aa').each(function () { > $(this).prepend('bb'); > }); > }); readyは、$(function()・・・と書くのが推奨されたやり方 $(function(){ $('.aa').each(function () { $(this).prepend('bb'); }); }); eachで回してthisとか意味ない。 $(function(){ $('.aa').prepend('bb'); }); : 235 [sage] 2014/07/25(金) 18:48:43.36 ID:??? いろいろ勘違いしていたので>236は忘れてくれ : 234 [sage] 2014/07/26(土) 01:10:00.69 ID:??? 質問の内容は実は wordpressのFAQManagerというプラグインでの話になります。 動的変化した後のページにパラメーターがないというのは厳密には間違いでした。 2頁目に行ってもブラウザのアドレス欄のURLは変更なし(パラメーターも付いていない) のですが、2ページ目のリンクをクリックするときのURLを見たら パラメーターが付いてました。 http://ドメイン/?p=183/?faq_page=2 のようなカタチです。 だいぶ強引ですが、リンクをクリックした際にクリックイベントで.prepend()を してみたのですが効きませんでした(クリックした瞬間だけ一瞬効きます) : Name_Not_Found [sage] 2014/07/26(土) 03:16:12.40 ID:??? 動的変化が非同期なんじゃない? 非同期処理後に prepend しないといけない : 239 [sage] 2014/07/27(日) 10:11:02.01 ID:??? そうなのかもしれません。 処理後に prependをどうやったらかけれるのかがわからなくて・・。 試しにページャーの数字をクリックしたらページリロードするようにしたら 何頁目が表示されていようが1頁目が表示されるようになるだけでしたw : Name_Not_Found [sage] 2014/07/27(日) 11:50:57.84 ID:??? > 2ページ目のリンクをクリックするときのURLを見たらパラメーターが付いてました。 リンク先URLと動的変化後のURLが一致しないのは好ましくない 動的変化後もURLが変化すべき。 ならば、FAQManagerの説明書を読んで処理後のコールバック関数を否定できないか読む。 なければ、コードを読んで該当コードを改変する。 そして、作者にフィードバックしておく。そうすれば、次回バージョンアップ後も自前で改変しなくて済む。 : 239 [sage] 2014/07/28(月) 00:13:11.90 ID:??? どんなソースかもわからない状態で わかる範囲でのベストなお答えいただき有難うございました。 phpのコールバックをjQueryで受け取るなど自分には敷居が高いので 別の方法を模索してみます ありがとうございました : Name_Not_Found [sage] 2014/07/30(水) 16:08:25.00 ID:??? <script type="text/javascript"> var area = ""; function eachFunc(index, elem) { if($(elem).find("input").attr("checked")){ var text = $(elem).find("span").html(); area = area + text; } } $(function() { $("button").click(function(){ $(".test").each(eachFunc); $("textarea").val(area); }) }); </script> <div class="test"> <input type='checkbox' name='sou' value='sou' checked /> <span>テスト1<br /><br /></span> </div> <div class="test"> <input type='checkbox' name='sou' value='sou' checked /> <span>テスト2</span> </div> チェックボックスがONのspanからHTMLを取り出し、テキストエリアに入れたいのですが、ON・OFF関係なくすべてテキストエリアに入ってしまいます。 たぶんif文が悪いんだと思うんですけど、どうすればいいですか? : 244 [sage] 2014/07/30(水) 16:41:23.99 ID:??? 自己解決しました : Name_Not_Found [] 2014/08/05(火) 19:15:45.37 :PBh+VR+W <style> .on{background:#00ff00;} .off{background:#ff0000;} </style> <a class="on">クリックするたびに背景色変更</a> $('.on').click( function(){ $(".on").removeClass("on").addClass("off"); } ); $('.off').click( function(){ $(".off").removeClass("off").addClass("on"); } ); こうすれば、<a>タグをクリックするたびに背景が緑から赤へ、赤から緑へ変わる動作を繰り返すと思ったのですが 最初の1回(緑→赤)しか動作せず、赤くなった<a>タグを押してもスクリプトが動いている様子がありません・・・ なぜこうなってしまうのでしょうか? : Name_Not_Found [sage] 2014/08/05(火) 20:24:32.64 ID:??? $('.on').click()は、実行した時点でclassがonの要素にハンドラを仕掛けるだけで、 その後classを変更してもハンドラが差し替わるわけじゃない : Name_Not_Found [sage] 2014/08/06(水) 11:02:05.28 ID:??? なるほど、この場合「off」というクラス名が最初に存在しないので$('.off').click()が処理できないということですね これを踏まえて構成を考え直したら、やりたいことが実現できました。ありがとうございました : Name_Not_Found [sage] 2014/08/06(水) 23:01:29.59 ID:??? <script> $(function() { $("button").click(function(){ $("textarea").val(function() { return $('.test input:checked + span').last().html(); }); }); }); </script> : Name_Not_Found [sage] 2014/08/06(水) 23:10:24.74 ID:??? $(function() { $('a.target').click(function() { // 'a.on, a.off' 等でも良い $(this).toggleClass("on off"); }); }); <a class="target on">クリックするたびに背景色変更</a> : 249 [sage] 2014/08/06(水) 23:18:43.24 ID:??? ごめん。間違えてた。 訂正 <script> $(function() { $("button").click(function(){ $("textarea").val(function() { return $('.test input:checked + span').map(function() { return $(this).html(); }).get().join(''); }); }) }); </script> : Name_Not_Found [sage] 2014/08/06(水) 23:35:32.16 ID:??? 解決済みの質問に回答しなくてもいいのでは : Name_Not_Found [sage] 2014/08/06(水) 23:47:31.33 ID:??? 解決したと書いてあるだけで、そのコードが載っていない それは、質問をするだけして自己解決しました。といって 去っていくやからと同じで、他の人の参考にならない。 またプロ品質の仕事としては、かろうじて動いていたとしても 無駄があるコードは、品質が低くコードレビューで弾かれる。 つまり未完成のコードと同じで、完成してない(解決済みではない)ということ。 : Name_Not_Found [sage] 2014/08/07(木) 00:25:57.59 ID:??? こっちの方が一行少なくてわかりやすいか。 $(function() { $("button").click(function(){ var text = $('.test input:checked + span').map(function() { return $(this).html(); }).get().join(''); $("textarea").val(text); }) }); 通常、valでfuncitonを引数にした時、thisを参照するんだけど でも今回はthisを参照しないから、分けて書いたほうが良さそう。 : Name_Not_Found [sage] 2014/08/07(木) 00:37:38.61 ID:??? > var text = $('.test input:checked + span').map(function() { > return $(this).html(); > }).get().join(''); これを一行で書く方法ないかな? 時々こういうコード書くんだよね。 .get().join('')は次の行に移動できるから無視するとして。 仮にjQuery プラグインを作ったとしたら、こんな感じでjQueryオブジェクトの 配列から、htmlメソッドを呼び出した結果を配列で返すみたいな。 var texts = $('.test input:checked + span').retrieve('html'); ないよなぁ。 : Name_Not_Found [sage] 2014/08/07(木) 21:57:10.49 ID:??? プロを名乗るならまず、設計上の問題点を指摘すべきだと思うが レイアウトの為にbr要素を使うべきではない input要素のname属性は同じformコントロール下であればユニークであるべきだ span要素はlabel要素に置き換わるべきだ(そうすればinput要素との対応関係も明確になる) $("button").click() は全てのbutton要素にイベントを定義してしまう $("textarea").val() は全てのtextarea要素を書き換えてしまう そもそも、同じフォームコントロール下におけばclass="test" は不要だ(form内の全 input[type=checkbox] を対象にすればよい) ,250 on, offの2パターンしかないのに on, off を付け替えるのは明らかに無駄だ onの有無で十分に判定できるはずだ 2つのclass名を使い分けるのは4パターンのUIが必要な時に限定される また、そもそも論としてa要素でこれをマークアップするのもおかしい UIとしてはcheckboxに相当するのだから <input type="checkbox"> でマークアップしてCSSで装飾するのが妥当だろう <input type="checkbox"> のデフォルトUIが嫌なら WAI-ARIA を使えば良い ようするにclass属性を使う必要は全くない ttp://www.hitachi.co.jp/universaldesign/ria/ajax/wai-aria/wd_20090224/index.html#button ttps://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_checkbox_role : Name_Not_Found [sage] 2014/08/07(木) 22:11:53.69 ID:??? 解決済みの質問に回答するやつ同士勝手にしてくれ : Name_Not_Found [sage] 2014/08/07(木) 22:13:10.39 ID:??? JavaScriptのスレで指摘点が HTMLとはね(苦笑) : Name_Not_Found [sage] 2014/08/07(木) 22:26:54.28 ID:??? > input要素のname属性は同じformコントロール下であればユニークであるべきだ 違うだろ。radioは同じnameを作らないといけない。 ユニークであるべきなどとは仕様のどこにも書いてない。 : Name_Not_Found [sage] 2014/08/07(木) 22:28:29.01 ID:??? getElementById が単数形で getElementsByName が複数形なのには 理由があるんだよ。 : Name_Not_Found [sage] 2014/08/08(金) 00:20:35.86 ID:??? radioではなく、checkboxだぞ : Name_Not_Found [sage] 2014/08/08(金) 00:27:01.14 ID:??? 同じname属性値を持つことは文法上制限されてない が、checkboxでそれをやる意義があるのか? : Name_Not_Found [sage] 2014/08/08(金) 01:05:49.96 ID:??? はぁ? 複数チェックしたら、name=1&name=2となって サーバー側では、name = [1,2] として配列で取得できるじゃん。 これはmultipleなselectで複数選んだのと同じ。 : 1/2 [] 2014/08/14(木) 13:36:16.75 :PcPGWVDF 個人的に使うためにchrome(chromium)の拡張機能を作ってます。 最終的にはchromeの安定版で使いたいですが、今はchromiumの最新版でテストしてます。 ttps://chrome.google.com/webstore/detail/note-anywhere/bohahkiiknkelflnjjlipnaeapefmjbh 作ってるのは簡単なメモ帳で、機能的にはこれとほぼ同じ(というか劣化版)です。 今見ているページに、htmlのテキストエリア(<textarea>)(+アルファ)とそれを装飾するcssとjQueryを差し込む形です。 content scriptモードでは(一部のサイトで)うまく動作したのですが、ブラウザアクションモードでは何の変化もありません。 ボタンをクリックした時だけ表示してほしいので何とかブラウザアクションモードで使いたいです。 ・backgroundページ(ここで使うファイルを全部読み込んどかなきゃいけないのか?と詰め込んでみた結果、無駄にここでメモを描画する仕様になってます。関係なさそうだけど致命的な害もなさそうなのでとりあえずそのままにしてます。) <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="memo.css"> // メモ帳用の自作cssの読み込み <script type="text/javascript" src="jquery.js"></script> // jqueryの読み込み <script type="text/javascript" src="jqueryui.js"></script> //jquery uiの読み込み <script type="text/javascript" src="inject.js"></script> // 今見ているページにcssやjsを差し込むための自作javascript。このページで実際に必要なのはたぶんこれだけ。 <script type="text/javascript" src="content.js"></script> // テキストエリアをhtmlに書き加えさせるための自作js </head> <body></body> </html> : Name_Not_Found [] 2014/08/14(木) 13:40:38.19 :PcPGWVDF ・inject.js chrome.browserAction.onClicked.addListener(function(tab) { // ボタンが押されると以下の動作をさせる。これはちゃんと動作してるはず chrome.tabs.insertCSS(tab.id, { file : "memo.css" }); // メモ帳用の自作cssの読み込み chrome.tabs.executeScript(tab.id, { file : "jquery.js" }); // jqueryの読み込み chrome.tabs.executeScript(tab.id, { file : "jqueryui.js" }); // jquery uiの読み込み chrome.tabs.executeScript(tab.id, { file : "content.js" }); // テキストエリアをhtmlに書き加えさせるための自作js chrome.tabs.executeScript(tab.id, { code : "console.log('a');" }); //デバッグ用。これはちゃんと表示される。 }); ・content.js $(document).ready( //これも要らないと思いますが害もなさそうなので放置 function() { $('body').attr('class', 'memolet'); $(".memolet").append('<前略><textarea class="memopadtextarea"></textarea><後略>'); //これも単にbodyでいい気がしますが放置 後略 長々と書きましたが、contentscriptモードで機能する以上問題があるのは「inject.js」か「content.js」だと思います。 manifest.jsonもブラウザアクションモード用に書いてるので問題無いと思います。 よろしくおねがいします。 : Name_Not_Found [] 2014/08/14(木) 13:43:07.03 :PcPGWVDF 間違えた、問題があると思うのは「inject.js」か「background.html」です。 よろしくおねがいします。 : Name_Not_Found [sage] 2014/08/14(木) 19:21:30.46 ID:??? エラーはでてないん? chrome.tabs.executeScript() のcallbackで次のchrome.tabs.executeScript() を実行してみてはどうだろう : Name_Not_Found [sage] 2014/08/14(木) 22:42:37.16 ID:??? できました!ありがとうございます。 ここに書いたコードでもエラーは出てなくて、もしコールバックしてないから動かないなら「$が定義されていません」みたいなエラーが出るはずだと思ってスルーしてました。 : Name_Not_Found [sage] 2014/08/20(水) 03:25:46.76 ID:??? ttp://jobinjapan.jp/job-listing/keyword-javascript.html : Name_Not_Found [] 2014/08/26(火) 16:34:05.20 :mJTser9P $(document).ready(function(){ setInterval(function(){ $('#blink').fadeIn(80); setTimeout(function(){$('#blink').fadeOut(80);},560); },880); }); #blinkを点滅表示させているんですが、別のタブを開いてからしばらくして元のタブに戻ると その間に溜まった?点滅のアニメーションがすごい勢いで動き出してしまいます 該当のタブが非アクティブの間はこの点滅アニメーションを止めておきたいのですがどうすればいいのでしょうか? : Name_Not_Found [sage] 2014/08/26(火) 17:46:26.31 ID:??? jqueryで式の頭に!!をつけるのはどういう意図があるのですか? 手っ取り早くbooleanに変換するためでしょうか? : Name_Not_Found [sage] 2014/08/26(火) 17:50:45.57 ID:??? jqueryのソースです : Name_Not_Found [sage] 2014/08/26(火) 18:49:27.85 ID:??? ( ゚Д゚)y─┛~~ : Name_Not_Found [sage] 2014/08/27(水) 14:02:34.91 ID:??? > 該当のタブが非アクティブの間はこの点滅アニメーションを止めておきたいのですがどうすればいいのでしょうか? その発想が間違ってるね。 setIntervalとsetTimeoutを併用しているからそういう問題が起きるんだよ。 どっちか一つを使うようにすれば自然に問題は解決する。 あとこれは冗長 $(document).ready(function(){ jQueyrで推奨されているやり方はこっち $(function(){ : Name_Not_Found [sage] 2014/08/27(水) 16:10:47.10 ID:??? 誰かdhtmlxscheduler使った事ある人いませんかね : Name_Not_Found [sage] 2014/08/31(日) 12:21:47.51 ID:??? jQueryでスマホサイト等に クリックで開閉するよくあるヤツ。 「+」「-」マークを切り替える場合、簡潔なソースはどんな感じになるでしょうか? : Name_Not_Found [sage] 2014/08/31(日) 14:05:08.74 ID:??? 知らんがな。 : Name_Not_Found [sage] 2014/09/01(月) 01:00:38.29 ID:??? タブ切り替えについて質問。 ページ表示の際に開くタブを指定は可能でしょうか? 例えば飛び元ページからURLにパラメーターを付けてリンクさせ、 それを取得して開くタブを切り替えるなど・・。 どうやっていいか全くわかんないけど : Name_Not_Found [sage] 2014/09/01(月) 03:21:30.64 ID:??? 完結なコードはjQueryどころか JavaScriptコード一切ないよ。 +-マークを切り替えるというのは、 抽象化して考えると、チェックのON・OFFで表せる。 つまりチェックボックスだ。 あとはCSSで、checkされたボックスの配下や次にある 要素を表示したりしなかったりするだけ。 : 279 [sage] 2014/09/01(月) 03:25:02.81 ID:??? まあ、レイアウトや対応ブラウザのCSS対応の制限で 実装しにくい時もあるが、そういう時は $('input[type=checkbox]').on('click', function() { $(チェックボックスに対応するブロックのセレクタ).toggleClass(クラス名, this.checked); }); まあ、これだけだろうね。 +-マークについてはCSSで実装できないブラウザはないから不要だろうな。 : Name_Not_Found [sage] 2014/09/03(水) 09:53:20.60 ID:??? <div class="test"> <button>button</button> <div class="text"> text </div> </div> <div class="test"> <button>button</button> <div class="text"> text </div> </div> ボタンをクリックしたらtext部分ににタグを挿入したいのですが、やり方がさっぱりわかりません thisを使った場合どうやってdivタグを特定すればいいのでしょうか? : Name_Not_Found [sage] 2014/09/03(水) 12:47:11.95 ID:??? buttonからdivタグを特定するにもいろいろ道があるよね たとえば親の要素以下のdivなら $(this).parent().find('div') だけど divのようなタグ名ではなくclassで指定したいとか、buttonの隣にあるdivがいいとか 違った道もある(HTMLがもう二度と変更されることがないなら気にする必要はないけれど) その辺を決めてから ttp://api.jquery.com/category/traversing/ をながめてみればいいんではないかな : Name_Not_Found [sage] 2014/09/03(水) 17:58:38.56 ID:??? ありがとうございます : Name_Not_Found [sage] 2014/09/03(水) 22:51:46.67 ID:??? , ありがとう チェックボックスの発想はなかった。。 クラスをトグルするってことは、背景画像で+と-の画像を切り替えってことか。 スマホだと背景画像の解像度とかサイズとか面倒じゃない? : Name_Not_Found [sage] 2014/09/04(木) 01:00:03.45 ID:??? アコーディオンでcheckboxってあまり見ないような・・・? 普通に見出しとかdivとかをクリックさせて、アコーディオンさせるとこをslideToggleで開閉が多い気がするけど。 +-は画像だとめんどいのでWEBフォント使ってCSSでbeforeなりafterなりに設定するのがラクなきが最近はしてるけどどうなんじゃろ。 ■好きなアイコンでWebフォントを作るサービス「IcoMoon」が熱い! - iLOG ttp://i-i-news.com/2013/08/icon-webfont7/ : Name_Not_Found [sage] 2014/09/04(木) 20:15:35.98 ID:??? Media Queries というか、ツリー表示が有用なのはある程度大きな画面サイズを持つタブレット以上であってスマホで生きるとは思わないけどね 見るか見ないかじゃなくて、論理構造として正しいかという話をしているんだと思うけど 多数派の手法が必ずしも良いとは限らない : Name_Not_Found [sage] 2014/09/04(木) 21:07:08.98 ID:??? こんな感じ? css: input[type="checkbox"].toggle{ font-size: 100%; width: 1em; margin: 0; padding: 0; opacity: 0; } input[type="checkbox"].toggle + label:before{ cursor: pointer; display: inline-block; content: "+"; margin-left: -1em; } input[type="checkbox"].toggle:checked + label:before{ content: "-"; } .toggle ~ .close, .toggle:checked ~ .open { display: none; } .toggle ~ .open, .toggle:checked ~ .close { display: block; } html: <input class="toggle" id="toggle-one" type="checkbox" /> <label for="toggle-one"></label><div class="open">opened contents</div><div class="close">closed contents</div> : Name_Not_Found [sage] 2014/09/04(木) 21:19:53.45 ID:??? > アコーディオンでcheckboxってあまり見ないような・・・? 念の為に言っておくと、完結なコードと言われたので 最小限のコードを言ったまでで、文書構造で言えば 適切ではないなとは思ってる。 : Name_Not_Found [sage] 2014/09/04(木) 21:23:47.63 ID:??? 面倒くさい奴だな : Name_Not_Found [sage] 2014/09/04(木) 22:51:29.33 ID:??? ,287 ありがとう。 どちらも参考になった。 before疑似要素使えば済む話だった。orz : Name_Not_Found [sage] 2014/09/05(金) 16:43:50.36 ID:??? 初歩的な質問で申し訳ないのですが たとえば.buttonを押すと.boxの高さが50pxずつ増えるという動きを実装したとき、MAXが400pxまでと したい場合(.boxの高さが400pxまで増えたら.buttonを消す)はどういう風に書けばいいですか? $('.button').click( function(){ $('.box').stop().animate({'height':'+=50px'},200); ここまではともかく、このあとの 「boxの高さが400px以上に達した場合、buttonの表示を消す」という部分の書き方がわかりません・・・ : Name_Not_Found [sage] 2014/09/05(金) 23:28:27.51 ID:??? とりあえずで。 $('.button').click(function (){ $('.box').stop().animate({'height':'+=50px'},200); var bH = $('.box').height(); $('.box').after(bH);//不要 if(bH > 150){ $('.button').hide(); } }); : Name_Not_Found [sage] 2014/09/07(日) 00:41:50.30 ID:??? 解決したなら礼くらい言えよな : Name_Not_Found [sage] 2014/09/07(日) 01:30:31.24 ID:??? _ , ,- -v- - 、 _ /::::::::::::::::::::::::::::::::::::::::\ /::::::::::::::::::::::::::::::::::::::::::::::::::::ヽ .(::(:::(::::/ ̄ ̄ ̄ ̄\::::::):::)::) (::(:::(:::)/・\ /・\(:::):::)::) .(::(:::(:::)  ̄ ̄  ̄ ̄ (:::):::)::) (::(:::(:::) (||||人||||) .(:::):::)::) 反省してまーす(チッ、うっせーな) .(::(:::(;;;) \ | .(;;;):::)::) (::(:::(::::\ \_| /::::):::)::) (::/ ̄| ̄|\ ||||||| /| ̄| ̄\::) | .〉 |人\_/入| 〈 | | | .| | ヽ_/. | | | | | | .| | .|__/. | | | | | | ヽ | ./ ヽ | / | | | | ヽ| .| | |/ | | | |. | | | | | | |_|___./ ヽ_./ ヽ__|_| .(/:::::::::\ ___|___ /:::::::::\) |::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::| .|::::::::::::::::::::::::::::::::::::::::::::::::::::::::::| |:::::::::::::::::::::::/ ̄ヽ::::::::::::::::::::::| : Name_Not_Found [sage] 2014/09/07(日) 15:55:36.86 ID:??? 例言えとかww : Name_Not_Found [sage] 2014/09/07(日) 19:08:56.87 ID:??? むしろ金払えw : Name_Not_Found [sage] 2014/09/08(月) 05:12:44.42 ID:??? $("p").prepend("<b>").append("</b>"); $("p").before("<b>").after("</b>"); この二つが反映されない理由はなんですか? 反映させる方法はありますか? : Name_Not_Found [sage] 2014/09/08(月) 06:29:49.22 ID:??? <script type="text/javascript"> function Display(no){ var name = document.getElementById("name").value; var num=0; if(name.length < 2){ alert("名前は2字以上でお願いしますだ。") return false; }else{ if(num ==0){ document.getElementById("SW1").style.display = "none"; document.getElementById("SW2").style.display = "block"; } } </script> <body> <div id="SW1"> <p>これはSW1のエリアです。上記SW2をクリックすると消えます。</p> <form onsubmit="return _submit();"> 名前:<input type="text" id="name" name="name" value=""><br> <input type="submit" value="送信" onclick="Display('no1')"><br> </div> <div id="SW2" style="display:none;"> <p>これはSW2のエリアです。上記SW1をクリックすると消えます。</p> <p>あなたの名前は<script type="text/javascript">+ name + </script>です。</p> </div> ボタンを押したら<div id=SW2>の画面に切り替わるようにしたいです。 : Name_Not_Found [sage] 2014/09/08(月) 07:51:11.80 ID:??? 文字列操作で構築していくのではなく、DOMというので構築していくんだ たとえば…<b><p></p></b>は4つの要素があるんじゃなくて、bの要素の子がpの要素と考えるみたいな…わかるかな? で、やりたいことは.wrap()/.wrapAll()/.wrapInner() あたりかな? 調べてみて : Name_Not_Found [sage] 2014/09/08(月) 11:06:49.44 ID:??? できました!ありがとうございます! 土日作業できなかったので遅くなってすみません; : Name_Not_Found [sage] 2014/09/08(月) 20:37:57.09 ID:??? ふぅ。 これでやっと成仏できる : Name_Not_Found [sage] 2014/09/09(火) 20:10:58.14 ID:??? ttp://oshiete.goo.ne.jp/qa/3006397.html このサイトのベストアンサーのソースのフォーム部分 input type="radio"を type="sabmit"に変えたら変更しなくなる。 いや、変更してるっちゃしてるんだけど、一瞬で元に戻る。 これをボタンを押さないかぎり戻らないようにするにはどうしたらいいでしょうか? : Name_Not_Found [sage] 2014/09/09(火) 20:54:23.22 ID:??? ベストアンサーのコードがベストアンサーに見えないなw こうやって質の低いコードを参考にして 平均的なレベルが低くなるのはどうしたらいいのか。 : Name_Not_Found [sage] 2014/09/10(水) 00:02:11.33 ID:??? ちょっと質問させてください。 以下のサイトの一番の下のサンプルを使ってアコーディオン・メニューを作ってます。 ttp://tokidoki-web.com/2013/03/%e3%80%8ejquery%e3%81%a7%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3%e3%82%92%e8%80%83%e6%85%ae%e3%81%97%e3%81%9f%ef%bc%92%e6%ae%b5%e9%9a%8e%e5%b1%a4%e5%bc%8f%e3%82%a2%e3%82%b3/ で、質問なんですが、アコーデオンを展開して、他ページに進んだ後、 「戻る」ボタンで戻ったとき、アコーディオンがすべて閉じてしまってる。 戻ったとき、直前の状態を再現するには、どうしたらよいでしょうか? ちなみに、javasrciptは初心者以下のスキルです。 : 288 [sage] 2014/09/10(水) 00:19:45.02 ID:??? まだアコーディオンの話が続いてるのかw で文書構造としては適切ではないといったが、 実はチェックボックスで作っていれば戻るで戻った時状態が 保存されている(事が多い)というメリットが有るんだよな。 ”事が多い” っていうのは、戻るを押した時にフォームの値が 前の状態になっているかはブラウザによって挙動が違うので。 クッキー・セッションを使う方法もあるが余計なデータが増えるのと 戻る以外でページを表示した時も状態が保存されてるという問題がある (これがいいか悪いかは別として) チェックボックスを使わないとして戻るを押した時だけ戻すには 隠しinputにでも開閉状態をシリアライズしておくといいのかな? しかし隠しinputを状態保存のためだけに文書構造的に気持ち悪い。 そもそも開閉状態をURLに入れるべきか。 方法はHistory APIもしくはhashbang : Name_Not_Found [sage] 2014/09/10(水) 06:53:11.29 ID:??? お前の意見なんてどうでもいいわ 本当になんとかしたいなら、プログラミング教室の先生にでもなれ : Name_Not_Found [sage] 2014/09/10(水) 08:48:13.41 ID:??? submitだろ : Name_Not_Found [] 2014/09/10(水) 19:01:27.37 :p+y53Vgx そう、間違った submit 打ち間違えた 全然できない : Name_Not_Found [sage] 2014/09/10(水) 21:07:19.80 ID:??? プログラミング教室の先生になったら、 質の悪いQ&Aがなくなるとでも思ってるの? : Name_Not_Found [sage] 2014/09/11(木) 01:35:15.96 ID:??? そんな事はどうでもいいから、 jQueryでphpのstrip_tag()と同じことができる 方法を考えて : Name_Not_Found [sage] 2014/09/11(木) 09:56:01.58 ID:??? javascript板から誘導されて来ました。 【環境】IE10以降・Firefox・Chrome・スマートフォン 【ライブラリ】Bootstrap + jQuery 【何をしたのか】appendで追加してもbootstrapの機能が動かない 【エラーメッセージ】特になし 【期待する結果】bootstrapの機能を含むものをappendで追加しても機能するようにしたい 【サンプルコード】 bootstrapとjQueryでサイトを作っています。 画像ファイルが追加されたら自動的に追加されるようにアクションがあったら以下のコードが動くようにしています。 $("#image-box").append(url); <div id="image-box"></div>にどんどん画像が追加されていく仕組みです。 urlには画像のアドレスとbootstrapの機能であるtooltipの属性などが記載されています。 例:<img src="sample.jpg" data-toggle="tooltip" data-placement="left" title="Tooltip on left"> しかし画像は表示されますがtooltipが表示されません。 例で表示されているものをappendではなく最初から表示した場合はtooltipが表示されるのでコードに間違いがあるわけではないようです。 appendで追加した場合はjavascriptなどの機能は動かない場合があるのでしょうか? : Name_Not_Found [sage] 2014/09/11(木) 22:04:46.46 ID:??? 本スレの方でレスしておきました。 ttp://peace.2ch.net/test/read.cgi/hp/1409325796/ ところでjavascript板ってどこ?w 誘導元を検索したけどここしか見つからなった。 : Name_Not_Found [sage] 2014/09/11(木) 23:49:54.95 ID:??? 普通に実行のタイミングの問題だろ : 初心者q [sage] 2014/09/12(金) 00:09:29.09 ID:??? jQスレでこちらが誘導されてまして、どなたかお願いします。 【環境】 IE9, Fox31 【ライブラリ】 jQuery 1.11.1 【何をしたのか】動的要素の読み込み後、on("ready")または記述時点実行 【エラーメッセージ】特になく、目的処理が反応しないだけ 【期待する結果】動的要素の下位要素のcss変更(addClass等) 【サンプルコード】下記参照 動的要素をイベントではなく読み込み終了後1度だけメソッドとして 実行したいのですがうまくいきません。やっていることは (1)空divにloadで読み込ませ、ここまでは画面表示もCSSも意図通り。 <div id="box"></div> ← $("#box").load("abc.html"); (abc.htmlは単体でも開けるul/liやpなど単純な内容) (2)これを本来このようにしたいのですがこれだと動的要素を認識しないので $("#box_中の要素").css(やりたい処理); (3)delegate的イベントに。それでも中の要素は反応せず。loadでも同様。 $("#box").on("ready","中の要素",function(){ (やりたい処理) }); (4)ちなみに一般的方法(?)でイベントを起こしてやると中の要素は意図通り処理されます。 またtriggerでこのイベントを起こしても処理されます。 $("#box").on("click","中の要素",function(){ (やりたい処理) }); そのページを読み込み後、jQの処理が進んで、clickなどせずにその記述の時点で ”やりたい処理”を行うにはどうしたらいいでしょうか?そもそも可能でしょうか? 最悪bodyにmouseoverで拾う手も考えましたが重くなるのは避けたいです。 よろしくお願いします。 : Name_Not_Found [sage] 2014/09/12(金) 00:23:24.18 ID:??? .load() のコールバックでもダメだったのか? $("#box").load("abc.html", function () { /* やりたい放題 */ }); : Name_Not_Found [sage] 2014/09/12(金) 01:26:41.55 ID:??? それくらいの内容になるなら ちゃんとjQueryも全ての記述をここに出した方がいいんじゃないか? 全然関係ないトコでミスってる可能性もあるし。 もしくは、単純化したコードにしてみて、それを出すとか。 : 初心者q [sage] 2014/09/12(金) 01:50:47.47 ID:??? レスありがとうございます。その形は試してないですがそれに書き換えるとかなり煩雑になりそうで loadの行はなるべくその1行で済ませたいです。というのは実際はもっと複雑でして div#boxは複数あり、abc.htmlも複数のdivがidで割り振ってあり、 $("#box div").each(function(){ //あれこれ、あれこれ、あれこれ x算出; $(this).load("abc.html div#" + x); }); という感じで更にUIがからんでたりでこの辺はあまり手をつけたくないという気持ちです。 その後またあれこれやってreadyやloadを試みてるのですがそこでできるとありがたいです。 : 初心者q [sage] 2014/09/12(金) 01:59:14.17 ID:??? レスありがとうございます。 ということはon("ready")などで通常はできるということでしょうか? 全て記述は荒らしに間違えられそうなので遠慮しておきます。 単純化は大変ですが検討してみます。 : Name_Not_Found [sage] 2014/09/12(金) 09:09:39.00 ID:??? お礼は? : Name_Not_Found [sage] 2014/09/12(金) 09:15:11.20 ID:??? ここは技術力が低いから参考にならないよ こっちが本筋。 + JavaScript の質問用スレッド vol.119 + ttp://peace.2ch.net/test/read.cgi/hp/1409325796/ : Name_Not_Found [sage] 2014/09/12(金) 11:03:39.74 ID:??? そっちは日記の代わりにしてるバカが居座ってるからなあ : Name_Not_Found [sage] 2014/09/12(金) 13:08:31.44 ID:??? 仕様書を読めない思い込みの激しい人が粘着してくるからお勧めしない : Name_Not_Found [sage] 2014/09/12(金) 13:17:08.90 ID:??? load() は非同期だから普通は callback で受ける callback が嫌なら Deferred や Promise を使うしかない ttp://api.jquery.com/category/deferred-object/ ttps://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Promise : Name_Not_Found [sage] 2014/09/12(金) 13:43:38.92 ID:??? .ajaxComplete() 使って何とかならんかな : Name_Not_Found [sage] 2014/09/12(金) 14:07:41.87 ID:??? 何を使っても結局は function で受けるんだから callback 内に別の場所にある function を call して変わらないんじゃないか、とよく思う 書き方の問題だよな : Name_Not_Found [sage] 2014/09/12(金) 21:27:51.83 ID:??? > その後またあれこれやってreadyやloadを試みてるのですがそこでできるとありがたいです。 その考えが間違いだな。 正しい方法でやらないから、あれこれやる羽目になってるんだよ。 正しい方法といえば、そもそもcssメソッドを使うことは 多くの場合、間違った方法なんだが、早いうちに正しい方法を学ばないと どんどんこんがらがるぞ。もう手遅れみたいだけど。 あなたが何故手遅れになった(他の方法をやりたくないと思っているか)というと 正しい方法を知らないで間違ったことをしているからだよ。 : Name_Not_Found [sage] 2014/09/12(金) 21:28:20.81 ID:??? もしソース全部出せるなら、 そのコードを半分にしてみせよう。 : Name_Not_Found [sage] 2014/09/12(金) 23:40:54.40 ID:??? auのページで見かけたんですが var pl = pl || {}; は多用されますか? これはどういう風に解釈すればいいんでしょうか。 head内のscriptは以下でした <script type="text/javascript"> var pl = pl || {}; pl.jq = pl.jq || jQuery.noConflict(true); pl.jq("#btn_close").on("click", function () { pl.jq("#hdn_btn_close").click(); return false; }); </script> : 初心者q [sage] 2014/09/13(土) 00:08:56.18 ID:??? の形は某有名サイトの解説を元にそう書いたのですが・・・ 通常コールバックなのですね、了解しました。 みなさん、特に,323さんご指摘ありがとうございます。 あれこれは別の処理ということです。 説明を簡潔にするためたまたまcss()で書きましたが実際は使用しておらずaddClass()などです。 でもレスありがとうございます。 : 初心者q [sage] 2014/09/13(土) 00:42:47.81 ID:??? その271別人です。そのタイムスタンプ勤務中で2chどころではないし。 なんなんすかね・・・。 : Name_Not_Found [sage] 2014/09/13(土) 00:47:04.56 ID:??? 本物を自称するならID出すなりトリップつけたほうが良いですよ あと、このスレで回答もらったようだし、レスぐらいはしては? : Name_Not_Found [sage] 2014/09/13(土) 00:50:51.41 ID:??? >レスぐらいはしては? は? : 初心者q [sage] 2014/09/13(土) 00:55:35.04 ID:??? トリップつけました。よろしくお願いします。 : 初心者q [sage] 2014/09/13(土) 01:47:07.57 ID:??? 早く答え書いてくれませんかね? : Name_Not_Found [sage] 2014/09/13(土) 01:48:45.79 ID:??? もう答えは出てるように見えるけど? : Name_Not_Found [sage] 2014/09/13(土) 07:09:30.66 ID:??? ||演算子の短絡評価を応用した省略記法です。 左がtrueだったら左を採用、そうでなければ右を採用ということです。 ワンライナーでも使われる言語では多用されていますが jsではそれほどでもないと思います。 : Name_Not_Found [sage] 2014/09/13(土) 10:56:58.82 ID:??? おめぇ、センスねぇなぁw : 314 [sage] 2014/09/13(土) 11:54:17.47 ID:??? は偽者、キモすぎ。何が楽しいのでしょう?もう1つのスレの人? このスレ初めて利用させていただきましたがまさかこんな人がいるとは。 スレ自体デフォでID出したほうがいいと思いますが 次(あるかどうかですが)からIDやトリップも検討します。 問題の件はon("ready")で別の方法またはご指摘の方法で解決しました。 どちらがいいかは吟味してみます。 (またこれにも偽が出てくるのでしょうかね。 ということでこれで最後にします。出てきたら間違いなく偽者です。) 回答者さんには感謝です。 : Name_Not_Found [sage] 2014/09/13(土) 13:37:38.77 ID:??? はわかりやすい偽物だなw : Name_Not_Found [sage] 2014/09/13(土) 13:39:49.79 ID:??? だから本スレに行けって言ったのに・・・。 : Name_Not_Found [sage] 2014/09/13(土) 14:13:08.97 ID:??? 本スレも偽者が出ているから変わらん : Name_Not_Found [sage] 2014/09/13(土) 18:08:56.22 ID:??? キモイよ 本スレはそのままコピペしてるアホがいるしな : Name_Not_Found [sage] 2014/09/13(土) 19:09:17.71 ID:??? 図星だったかw : Name_Not_Found [sage] 2014/09/13(土) 19:48:00.45 ID:??? jQueryのテンプレートプラグイン、「jquery-tmpl」って使ってるサイトあまりみないね。 SEO考えなくて良いのであればとても便利そうなんだが : Name_Not_Found [sage] 2014/09/13(土) 20:04:29.81 ID:??? JS強制する時点でSEOは全く考慮されてないじゃない(Node,js を使うなら別だけど) : Name_Not_Found [sage] 2014/09/13(土) 20:57:58.62 ID:??? ↑こういうやつってひねくれた記述すんだろな : Name_Not_Found [sage] 2014/09/14(日) 00:02:21.15 ID:??? 楽天とかヤフーショッピングみたいなphp使えないサーバーがあって。。 : Name_Not_Found [sage] 2014/09/14(日) 00:14:19.45 ID:??? だからJS醸成するからSEO対策になってないんじゃない 作業を効率化するなら制作環境でテンプレートエンジンを使うぐらいしかないでしょ : Name_Not_Found [sage] 2014/09/14(日) 00:48:04.04 ID:??? × JS醸成 ○ JS強制 : Name_Not_Found [sage] 2014/09/14(日) 01:02:11.51 ID:??? うん。質問の意図としては jquery-tmplって便利?問題は特にない?ってことを聞きたかったんだが。 : Name_Not_Found [sage] 2014/09/14(日) 14:26:04.05 ID:??? テンプレートとか使うレベルならMVCにするんじゃね? : Name_Not_Found [sage] 2014/09/14(日) 16:08:18.27 ID:??? グローバル変数を変える方法ってないのかな var n=5; を 何かイベント起こったら n=4 またなんかおこったら n=3 になるようにしたい。 : Name_Not_Found [sage] 2014/09/14(日) 16:31:11.46 ID:??? すればいい。だがグローバル変数は使うな。 ローカル変数を変えればいいだろ。 : Name_Not_Found [sage] 2014/09/14(日) 16:48:32.10 ID:??? 変数の意味分かってるのかねw : Name_Not_Found [] 2014/09/14(日) 17:12:13.88 :nZnN2Xzj なんとなくずっと prototype.js 使ってたんですが、 早めに jquery に移行したほうがいいですかね? けっこう膨大な数なんで全部移行しようとすると数ヶ月はかかりそうですが : Name_Not_Found [sage] 2014/09/14(日) 18:59:01.08 ID:??? 早めというか、もう遅いがw jQueryはprototype.jsと同居できる機能を持っているから 新しい部分はjQueryに置き換えていけばいい。 俺が推奨する書き方はこう。 jQuery(function($) { ・・・jQuery用のコードを書く }); こうすれば関数内は普通に$を使ってコードを書くことが出来る。 noConflictは、jQueryをprototype.jsよりも後に読み込む時に必要。 prptoype.jsよりも先にjQueryを読み込んでいるならなくても良い。 : Name_Not_Found [sage] 2014/09/14(日) 19:18:36.74 ID:??? とある画面に戻るたんびに、とある変数が−1される。または+1される関数を作りたい みんなならどうやる? : Name_Not_Found [sage] 2014/09/14(日) 19:20:28.59 ID:??? if (とある画面) { とある変数--; } : Name_Not_Found [sage] 2014/09/14(日) 19:41:02.94 ID:??? 変数n=5; A画面 →B画面→A画面→B画面 n=5 n=4 n=4 n=3 こんな感じにしたい。 : Name_Not_Found [sage] 2014/09/14(日) 19:43:18.90 ID:??? そのまま組めよw : Name_Not_Found [sage] 2014/09/14(日) 19:46:26.84 ID:??? そのまま組む方法がわからんぜ。っフ : Name_Not_Found [sage] 2014/09/14(日) 19:51:36.10 ID:??? 例えばB画面の時に<script language=javascript> n=n-1</script> ってやってもA画面に戻ったらn=5のまんまなんだよ。 の書き込みを見て function tan(a) { var a=5; sessionStorage.setItem("formdata",a); var n = sessionStorage.getItem("formdata"); n=n-1; return n; } って関数作って、<p><script language=javascript>document.write(tan())</script></p> ってやってもだめだった。 : Name_Not_Found [sage] 2014/09/14(日) 20:00:12.99 ID:??? そりゃ画面遷移するならクッキー食わせなきゃだめだろw : Name_Not_Found [sage] 2014/09/14(日) 20:27:25.32 ID:??? それどうやるの? : Name_Not_Found [sage] 2014/09/14(日) 20:35:58.62 ID:??? ぐぐれよ : Name_Not_Found [sage] 2014/09/14(日) 20:46:20.58 ID:??? 画面遷移 クッキー で探してみるわ 色々ありがとう : Name_Not_Found [sage] 2014/09/15(月) 02:27:39.15 ID:??? <script language="JavaScript"> $(function() { $(".ck").click(function(){ var test = $(".ck").prop("checked"); if(test === true){ $(this).parent(".but").css("background-color","rgb(255, 153, 204)"); }else{ $(this).parent(".but").css("background-color","rgb(238, 238, 238)"); } }); }); </script> <div class="but"> <input type="checkbox" name="ss" value="ss" class="ck" /> </div> <div class="but"> <input type="checkbox" name="ss" value="ss" class="ck" /> </div> <div class="but"> <input type="checkbox" name="ss" value="ss" class="ck" /> </div> 一番上のdivの背景色しか変わらないのですが、どうすれば修正できますか? : Name_Not_Found [sage] 2014/09/15(月) 04:47:59.28 ID:??? languageはHTML 4.01の時代から とっくに非推奨になってる古い属性であり、 今はtypeだがhtmlでは省略できるのだから不要。 css()の行がムダに長い。少なくともこう書くべき。 var color = test ? "rgb(255, 153, 204)" : "rgb(238, 238, 238)"; $(this).parent(".but").css("background-color", color); testは意味がわかりにくいのでcheckedにしよう。$(".ck")は$(this)とか書くべき。 でないと。.ckの一番最初のcheckedの判定になる。 これじゃねーのバグは?w 俺がやると変なコードを直してるだけでバグも直せてしまうw あと適度にスペースを入れよう。 <script> $(function() { $(".ck").click(function() { var checked = $(this).prop("checked"); var color = checked ? "rgb(255, 153, 204)" : "rgb(238, 238, 238)"; $(this).parent(".but").css("background-color", color); }); }); </script> : Name_Not_Found [sage] 2014/09/15(月) 04:54:16.35 ID:??? 更に言うのなら、css()メソッドは使うべきではない。 "色" は cssファイルもしくはstyle要素で決めて、 JavaScriptからはclassを指定するべきだ。 <style> .but { background-color: rgb(255, 153, 204) } .but.checked { background-color: rgb(238, 238, 238) } </style> そうすると、コードはここまで減る。 <script> $(function() { $(".ck").click(function() { $(this).parent(".but").toggleClass('checked', $(this).prop("checked")); }); }); </script> : Name_Not_Found [sage] 2014/09/15(月) 05:27:19.76 ID:??? これでいけるのか。文字数としては増えてしまったが、 親を探すという気持ち悪い処理をしなくて済む。 $(function() { $(".but").on('click', '.ck', function(event) { $(event.delegateTarget).toggleClass('checked', $(this).prop("checked")); }); }); : Name_Not_Found [sage] 2014/09/15(月) 06:22:09.02 ID:??? ありがとうございます。 ここまで短くなるんですね : Name_Not_Found [sage] 2014/09/15(月) 16:14:49.38 ID:??? もお願いします : Name_Not_Found [sage] 2014/09/15(月) 16:18:21.38 ID:??? jQueryなしでできるから、こっちにいけ + JavaScript の質問用スレッド vol.121 + ttp://peace.2ch.net/test/read.cgi/hp/1410603104/ : 366 [sage] 2014/09/15(月) 21:02:51.06 ID:??? だめだ、cookieわかんね : Name_Not_Found [sage] 2014/09/18(木) 23:31:05.20 ID:??? ■質問です 下記みたいなケースで、<p class="p1">、<p class="p2">内にあるaタグのhref属性を それぞれの<h2>内のaタグのhref属性と同じにしたい場合、どのように書けばよいでしょうか。 <div id="hoge"> <h2><a href="http:aaa.com/">1</a></h2> 〜イレギュラーなタグ〜 <p class="p1"><a href="">aaa</a></p> <span class="p2"><a href="">aaa</a></span> <h2><a href="http:bbb.com/">2</a></h2> 〜イレギュラーなタグ〜 <p class="p1"><a href="">bbb</a></p> <span class="p2"><a href="">bbb</a></span> <h2><a href="http:ccc.com/">3</a></h2> 〜イレギュラーなタグ〜 <p class="p1"><a href="">ccc</a></p> <span class="p2"><a href="">ccc</a></span> </div> それぞれのhref属性を変数のようにしたいのと、もし可能であればタグの並びや順番に依存したセレクタではなく、 classで指定できるとベストです 宜しくお願いいたします。 : Name_Not_Found [sage] 2014/09/18(木) 23:50:21.67 ID:??? タグの並びや順番に依存したセレクタがいやというなら、 順番以外でp1、p2と h2がどうつながるのかわからんのだが。 : Name_Not_Found [sage] 2014/09/19(金) 00:37:16.55 ID:??? これだけの情報なら、p1、p2の前のh2としか言いようがないと思うが イレギュラーなタグにh2が入ってるとまずいし、 ”前のh2” ってことは順番に依存してるし答えようがないな。 : 375 [sage] 2014/09/19(金) 03:07:43.87 ID:??? すいませんでした。 では、順番も固定で、h2も1度だけという認識で大丈夫です。 聞きたい部分としては 例えば $(function() { var rUrl = $('#hoge').find('h2 a').map(function() { return $(this).attr('href'); }).get(); のようにそれぞれのh2内のaタグのhref属性値を配列等で取得した場合、 それをそれぞれに続く.p1と.p2のaタグに割り当てる方法が知りたいです。 ※もちろんこの方法以外でも大丈夫です。 宜しくお願いいたします。 : Name_Not_Found [sage] 2014/09/19(金) 03:57:09.00 ID:??? これでいいのか? 久々にeach使ったほうがわかりやすい課題だな。 でもタグをもう少し構造化したほうがいいと思うが。 仕様が奇妙 $('h2').each(function() { var url = $(this).find('a').attr('href'); $(this).nextUntil(this.tagName).filter('.p1, .p2').find('a').attr('href', url); }); : Name_Not_Found [sage] 2014/09/19(金) 04:46:52.02 ID:??? やっぱりthis.tagNameよりもセレクタを指定した方がマシか あとちょっとnextUntilの第二引数が使えた。 $('h2').each(function() { var url = $(this).find('a').attr('href'); $(this).nextUntil('h2', '.p1, .p2').find('a').attr('href', url); }); : Name_Not_Found [sage] 2014/09/19(金) 09:42:27.98 ID:??? <p class="p1"><a href="">aaa</a></p> <span class="p2"><a href="">aaa</a></span> は後から挿入したほうがマシな気がするな。 各セクションをsection要素で括れば、appendChildしやすいだろう。 : Name_Not_Found [sage] 2014/09/20(土) 01:17:21.43 ID:??? できないようです・・。 下記であっておりますでしょうか?? <script src=" ttp://code.jquery.com/jquery-1.9.1.min.js"></script> <script> $(function(){ $('h2').each(function() { var url = $(this).find('a').attr('href'); $(this).nextUntil('h2', '.p1, .p2').find('a').attr('href', url); }); }); </script> <div id="hoge"> <h2><a href="http:aaa.com/">1</a></h2> <p class="p1"><a href="">aaa</a></p> <span class="p2"><a href="">aaa</a></span> <h2><a href="http:bbb.com/">2</a></h2> <p class="p1"><a href="">bbb</a></p> <span class="p2"><a href="">bbb</a></span> <h2><a href="http:ccc.com/">3</a></h2> <p class="p1"><a href="">ccc</a></p> <span class="p2"><a href="">ccc</a></span> </div> : Name_Not_Found [sage] 2014/09/20(土) 01:44:53.29 ID:??? あー、根本的な所を間違ってるよ。 君、URL間違ってるから。 : Name_Not_Found [sage] 2014/09/20(土) 08:00:38.11 ID:??? 全角空白だな : Name_Not_Found [sage] 2014/09/20(土) 08:38:31.85 ID:??? それもあったなw 明らかにわかる所は、無意識に修正しちゃったからなw : Name_Not_Found [sage] 2014/09/20(土) 19:14:54.91 ID:??? なんかワロタwww : Name_Not_Found [sage] 2014/09/21(日) 02:20:02.55 ID:??? ぐはっ なんで全角だ?? できました。有難うございました! : Name_Not_Found [sage] 2014/09/21(日) 21:44:37.05 ID:??? Backbone.View のid/className/tag/elの違いがよくわかりません el --> 操作対象のオブジェクト(DOM)がセットされていることはわかりましたが、id/className/tagは何のために使うんでしょうか? それと、Backbone.Viewをインスタンス化した時に、インスタンスはDOMと必ず結び付けられていますか? : Name_Not_Found [] 2014/09/23(火) 12:21:39.87 :uhiGJoNF IE8のみmediaqueryを読み込んでくれない ぐぐって出る解決策は全部見たが原因わからない…誰かわかる人いたら教えてください… : Name_Not_Found [sage] 2014/09/23(火) 16:59:02.05 ID:??? query違い。 まあjQueryでも解決できるだろうけど : Name_Not_Found [sage] 2014/09/23(火) 18:52:39.72 ID:??? IE8はmediaquery(CSSの機能) をサポートしない : Name_Not_Found [sage] 2014/09/23(火) 19:28:55.19 ID:??? すみません言葉不足でした jQueryのcss-mediaqueryを使ってるんですがなぜかIE8で読んでくれなくなって…ということでした : Name_Not_Found [sage] 2014/09/23(火) 23:11:38.89 ID:??? そもそもmediaqueryやレスポンシブ用のCSS/JSは PC以外に読み込まれれば良いものだから IE8で読み込まれる想定がおかしいのでは? PCのIE8でウインドウサイズを小さくされたときに最適化したいという事だろうか : Name_Not_Found [sage] 2014/09/24(水) 01:34:11.77 ID:??? 例えばこれとか ttp://d.hatena.ne.jp/kzhrk/touch/20121022/1350920894 : Name_Not_Found [sage] 2014/09/24(水) 10:04:53.86 ID:??? mediaquery は環境に応じたデザイン/レイアウトを提供するための機能であってデバイス依存は存在しない 第一、あなたの考え方に沿うなら、PCとPC以外で出力するCSSを変化させなければならない どのデバイスにも同じCSSを提供するのが目的だから、その考え方は根底からずれているように思う : Name_Not_Found [sage] 2014/09/24(水) 15:17:24.73 ID:??? もとのCSSをPCレイアウト基準で作って、モバイル、タブレット最適化にメディアクエリ使うってなら間違いでもないでしょ。 モバイルファーストなら君の言う通りだが。 そもそもどちらの方法で作ったのか? どのCSSプロパティが効かないのか?で、 CSSのブラウザ依存問題か、jquery側の問題なのか分かれてくる。 : Name_Not_Found [sage] 2014/09/24(水) 17:15:49.99 ID:??? PCファーストとかモバイルファーストと言ってる時点でずれてると思うけどね PCのモニタ解像度だって多種多様なわけだし、解像度別に分けるのがmediaqueryの意義 : Name_Not_Found [sage] 2014/09/24(水) 17:41:27.57 ID:??? いや、みんなそんな事知ってるよ。 レスポンシブさせるために、 pc中解像度は960px タブレット向きで768pxまで スマホで480以下だろ? で、WinPCでIE8使ってる奴の解像度が今時768以下とかあるか? 逆に今時IE8使ってるような無頓着な奴が1280以上の高解像度使ってるかも怪しいし。 ならPC中解像度を基準にレスポンシブ作って、 この段階でIE8対策バッチリしといて それ以下のレイアウトはjquery使わずとも普通にメディアクエリ使えばいいんじゃないか? : Name_Not_Found [sage] 2014/09/24(水) 17:52:07.60 ID:??? 君の想定する以上に解像度の区分けがあるかもしれないだろ IE8 で mediaquery が不要とは限らない : Name_Not_Found [sage] 2014/09/24(水) 18:21:03.10 ID:??? デカいサイズなんてフルードレイアウトなり全部リキッドで作りゃすむじゃん。 で、どんなプロパティ適応させたいんだよ? メディアクエリで使うようなプロパティなんて、 固定とリキッドの切替えか、displayのon-off、floatの切り替えくらいだろう。 それでまかなえないようなレイアウト作ってる段階で設計ミスだろ。 俺は一般論言ってるだけ。 IE8でメディアクエリきかない こんな情報だけでズレてるなど想定がどうのなど俺はエスパーじゃないからわからんわ。後は任せた。 : Name_Not_Found [sage] 2014/09/25(木) 02:00:12.90 ID:??? 実際の所、mediaqueryの機能見ると、どう考えてもクロスデバイスに向けた内容じゃん。 スマホやタブレットが出始めてから各社ベンダーやW3Cがせっせと対応しているようにしか思えない。 解像度だってどう考えてもスマホ対応を考えた内容であって IE8やPCサイトの解像度なんてそもそもの目的じゃないよ。 スマホサイトをPCの、しかもIEで見て、表示がおかしいですって言ってるようなもんだ。 : Name_Not_Found [sage] 2014/09/25(木) 02:21:32.07 ID:??? なかなか思い込みの激しい人だな : Name_Not_Found [sage] 2014/09/25(木) 10:51:34.49 ID:??? 後は任せたと言いながら、加えて言う内容じゃないのは確かだね : Name_Not_Found [sage] 2014/09/25(木) 14:19:22.89 ID:??? スマホ対応するためにレスポンシブでサイト作りました。 IE FF ch sa iphone Androidで確認してクラに提出すると 「IE8で見たときになぜかウィンドウ小さくしてもレイアウトが変化しない!他のブラウザは出来てるのに!IE8でもちゃんと見えるようにしてください!」 と、クレームが入る。 わかりました!ではまずスマホで動くIE8をご用意ください。 : Name_Not_Found [sage] 2014/09/25(木) 14:26:35.14 ID:??? 一休さんか : Name_Not_Found [sage] 2014/09/25(木) 15:24:08.22 ID:??? 俺はスマホからだからメディアクエリを英語では書いてないだろよ。 もういい加減スレ違いだしやめようぜ。 : Name_Not_Found [sage] 2014/09/25(木) 15:54:48.58 ID:??? 質問者なんですが、なんかすみませんでした… @media screen and (max-width: XXpx) これ自体がIE8ではきかなくなっていました IE8でスマホとか意味わからないとは自分も思うのですが、対応してね!といわれてしまうと従うほかなくて… >IE7,IE8だとローカル環境で機能しない この箇所を見落としていました…ローカルでしか見ていませんでした。これが原因な気がしますそうであってほしい 一度テストサーバーにあげてみます、ありがとうございました : Name_Not_Found [sage] 2014/09/25(木) 16:53:32.42 ID:??? 付け加えるとローカルでもサーバを立てれば動くはず ローカルテストはローカルサーバを立ち上げてやるのが基本だよ : Name_Not_Found [sage] 2014/09/25(木) 23:37:01.87 ID:??? ほれ見ろ やはりIE8でスマホじゃないか。 誰だよPCの解像度がどーのとか言ってた勘の悪いやつ。 で正解じゃないか。 しかももっと前にで結論だしてたのにな。 : Name_Not_Found [sage] 2014/09/25(木) 23:51:52.44 ID:??? さらに付け加えると のクライアント?が言っているのは 「IE8で可変に対応してね」と言っているのではなく、 IE8に対応してね(普通にPCで見た時) という事。 苦手意識が強かったり、逆に覚えたてでいい気になってると すぐそれに結びつけて考えてしまいがちだよな。 : Name_Not_Found [sage] 2014/09/26(金) 01:06:28.48 ID:??? 恥の上塗りという言葉を知ってるかね IE8で機能させたいのだからは見当外れ : mediaquery [sage] 2014/09/26(金) 02:38:10.74 ID:??? いや、質問者が先方の依頼を勘違いしている可能性に100ガバスかけるよ。 無駄な作業を助長してどうすんの? そもそもそんなマイナーな事するならIE8はJSでやった方がよっぽど早い。 しかもここはJavaScriptのスレ。 : Name_Not_Found [sage] 2014/09/26(金) 09:51:51.02 ID:??? スレチで続けてすみません、これで最後にしときます IE8でスマホ対応(PCにおけるウィンドウ可変)でした。 一度見せて、不具合として修正を申し付けられているので勘違いではないと思う でも確かにJSで切り替えしたほうが早かったですね : Name_Not_Found [sage] 2014/09/26(金) 11:10:58.14 ID:??? > いや、質問者が先方の依頼を勘違いしている可能性に100ガバスかけるよ。 憶測も程々にしたら > しかもここはJavaScriptのスレ。 君はで css3-mediaqueries-js の質問だと宣言されている事を分かってないよね JavaScript の質問だからこのスレで質問するのは間違ってない ttp://code.google.com/p/css3-mediaqueries-js/ 時点では質問の仕方が悪いと思うけどね : Name_Not_Found [sage] 2014/09/26(金) 12:20:01.35 ID:??? だってよw : Name_Not_Found [sage] 2014/09/26(金) 13:01:36.63 ID:??? 勘違いしてないと書いてあるだろ 日本語読めないのか : Name_Not_Found [sage] 2014/09/26(金) 13:08:20.33 ID:??? スマホ対応=リキッドレイアウトと思ってる奴の言葉なんて何も信用ならんってことじゃないの? ひとりですごく盛り上がっちゃってるみたいだけど、冷静に文脈読めるようになれば幸せになれると思うよ : Name_Not_Found [sage] 2014/09/26(金) 13:13:42.20 ID:??? スマホで動くIE8なんてあるの? なんで存在しないスマホ版IE8に 対応しようとしてるの? 馬鹿じゃないかな。 : Name_Not_Found [sage] 2014/09/26(金) 13:21:00.45 ID:??? そう、バカなんだと思うよ : Name_Not_Found [sage] 2014/09/26(金) 13:41:20.94 ID:??? 一人だと思ってる時点ですでに憶測が外れてるし、冷静じゃないし馬鹿まる出しだ。 ちなみに俺は質問者と憶測野郎は同一だと勘違いして馬鹿だわ。反省する。 : Name_Not_Found [sage] 2014/09/26(金) 13:54:41.51 ID:??? この人は誰と戦っているのでしょうね : Name_Not_Found [sage] 2014/09/26(金) 16:43:25.73 ID:??? 俺だよ、オレオレ : Name_Not_Found [sage] 2014/09/26(金) 16:47:09.08 ID:??? ウィアーザチャンプ : mediaquery [sage] 2014/09/27(土) 01:38:50.67 ID:??? どうもすいませんでした! つ100ガバス 受け取ってくれ : Name_Not_Found [] 2014/09/29(月) 17:07:41.64 :4+zH/ouo jQueryのクリック動作について質問です。 $('.test').click(function () { 〜ページの内容が変わる〜 }); こういうクリック動作があるとして、ボタンなどをクリックして実行するのではなく、 ページが読み込まれた段階で「クリックしたことにする」 ような方法ってありますでしょうか? 「〜ページの内容が変わる〜」のコード箇所を 外部関数にする方法以外であれば教えて下さい。 : Name_Not_Found [sage] 2014/09/29(月) 17:11:05.98 ID:??? $('.test').trigger("click"); : Name_Not_Found [sage] 2014/09/29(月) 17:33:46.03 ID:??? triggerだと本当にクリックしたのと近くなる。 それがいい時もあるが、関数を実行したいだけなら triggerHandlerの方が軽い。 なお、「〜ページの内容が変わる〜」のコード箇所を 外部関数にする方法が一番良い。 : 425 [sage] 2014/09/29(月) 18:02:26.19 ID:??? ありがとうございます。ぜひ参考にさせていただきます。 : Name_Not_Found [] 2014/09/30(火) 11:36:01.15 :7Lhcxhmv 【環境】Chrome 【ライブラリ】jQuery 2.1.1 【何をしたのか】ajaxでpost送信する 【エラーメッセージ】403 forbiddenエラーがコンソールに表示される 【期待する結果】POSTしたい 【サンプルコード】 var sample = '<script>alert('sample')</script>'; $.ajax({ url: 'test', type:'post', timeout:1000, data: {'sample': sample}, success: function(data, status, jqXHR) { alert("OK"); }, error: function(data, status, jqXHR) { console.log(data); console.log(status); console.log(jqXHR); }, }); ログを確認してもtestそのものへのアクセスは無く403 forbiddenエラーとなっています。 var sampleに普通の文章を入れた場合は送信できています。 HTMLエンティティー化しているので大丈夫かとは思っていたのですが原因がわかりません。 問題点などあればご教示いただければと思います。 : Name_Not_Found [sage] 2014/09/30(火) 13:32:23.89 ID:??? サーバサイドの問題である可能性があるのでHTMLのformで同じ値を送信して検証するといいと思う : 429 [] 2014/09/30(火) 14:01:56.00 :7Lhcxhmv サーバー側のセキュリティによって怪しい文字列がカットされておりました。 助かりました。ありがとうございます。 : Name_Not_Found [sage] 2014/10/04(土) 16:54:14.46 ID:??? 一意に求まる質問じゃないのですが… jQueryのParticleground( ttp://jnicol.github.io/particleground/) みたいな動きが好きです。 この他に似たような動きのある背景が作れるライブラリは無いでしょうか? : Name_Not_Found [sage] 2014/10/05(日) 19:44:03.06 ID:??? jQueryのバリデーションのライブラリ探してるんだけど、今は何が良いの? exValidationっての見たけど開発が止まっているようだ 最後の更新が3年前 validation-Engineってのは最終は2ヶ月前らしいけど 日本語対応してるのであればやっぱこの2つのうちどっちかなのかな? : Name_Not_Found [sage] 2014/10/05(日) 22:38:53.38 ID:??? validation なんて大したコード量ではありませんし、自分で見て必要な機能が揃っていればいいのでは? 最も、HTML5 で validation用の属性(pattern 属性など)が出来てきてライブラリの必要性は減っているでしょうし、polyfillコードを書けば十分という気はしますね。 ttps://html.spec.whatwg.org/multipage/forms.html#attr-input-pattern : Name_Not_Found [sage] 2014/10/06(月) 22:33:20.68 ID:??? そのpolyfillが大変なんじゃねーか。 pattern属性、require、各種typeのデフォルトの処理 そしてエラーの時に勝手に出てくるメッセージ それらをコントロールするための JavaScriptインターフェース きりがないぞ。 : Name_Not_Found [sage] 2014/10/08(水) 02:31:25.00 ID:??? 一つ一つは大したことないと思いますけどね 大変と思うなら既存のPolyfillを使えばいいのでは? : Name_Not_Found [sage] 2014/10/08(水) 03:57:11.83 ID:??? 全部合わせれば大変だろ。 入力チェックメソッドだけじゃなくて、 入力チェックに引っかかったら 画面にポップアップが表示されて POSTできないなどといった処理まであるんだから。 : Name_Not_Found [sage] 2014/10/08(水) 04:03:17.82 ID:??? どうもHTML5のValidationの機能がどれだけあるかわかってないみたいだからリンク出しておくわ ttp://girliemac.com/blog/2012/12/01/html5-form-validation-jp/ : Name_Not_Found [sage] 2014/10/08(水) 08:47:16.57 ID:??? 俺HTML5使ってないんだけど、上のスレ読んだがvalidation設定のために正規表現使わんといかんのか? : Name_Not_Found [sage] 2014/10/08(水) 13:34:55.35 ID:??? その時、必要な機能だけ実装すればいいでしょう 全ての機能を必要とするけーすなんて稀です 何度も言いますが、面倒なら既存のライブラリを使えばいいでしょう なぜそんなに大変ということに拘るんです? : Name_Not_Found [sage] 2014/10/08(水) 14:04:21.06 ID:??? もっとたくさんあると思ったら、required属性、pattern属性だけなのか CSSの構文解析を省けば難易度はそれ程高くないな : Name_Not_Found [sage] 2014/10/08(水) 15:59:23.55 ID:??? 調べてみたけど、h5validate.js のコードは307行しかない(互換性は知らんけど) ttps://github.com/ericelliott/h5Validate : Name_Not_Found [sage] 2014/10/15(水) 10:45:42.78 ID:??? ttp://pastebin.com/Lm4Wht2x AngularJSで上記のように配列を表示して、配列を追加しても表示が更新されません。 listはngRepatで参照してるだけでバインドされてないからなのかと思いましたが、 それが正しい場合どうすればいいかが判りません… : Name_Not_Found [sage] 2014/10/15(水) 12:08:17.07 ID:??? 1つのng-controller="bindingCtrl"の中に両方入れないと ttp://pastebin.com/CfcSgNM7 : Name_Not_Found [sage] 2014/10/18(土) 01:56:39.81 ID:??? データを表示する表(グリッド)で、 グリッドのサイズが可変、テーブル全体のサイズも可変の物を作りたいと思ってます。 【ライブラリ】 jquery-1.11.1.min.js テーブル全体のサイズ変更(resizeable) jquery-ui.min.js ttp://jqueryui.com/resizable/ グリッドのサイズ可変 jquery.jqGrid.min.js ttp://trirand.com/blog/jqgrid/jqgrid.html それぞれ片方ずつはうまくいくんですが、両方やると動いてくれず悩んでいます。 【サンプルコード】 ◆html <table id="tbl_comment"><tr><td bgcolor="#eeeeee">sample</td></tr></table> ◆js $(document).ready(function() { $('#tbl_comment').resizable({}); $("#tbl_comment").jqGrid({ colModel: [{name:'test'}] }); var mydata = [ {test:"aaaa"} ]; for(var i=0;i<=mydata.length;i++) jQuery("#tbl_comment").jqGrid('addRowData',i+1,mydata[i]); } この解決策、または他に実現可能なライブラリをご存じの方がいましたら、 ご教示お願いしますm(_ _)m : Name_Not_Found [sage] 2014/10/18(土) 02:24:35.76 ID:??? 自己解決。 ttp://d.hatena.ne.jp/renmen/20110204/1296821522 要素一つ被せて、onresizeで連動するようにしてうまくいきました。 : Name_Not_Found [sage] 2014/10/22(水) 02:45:06.87 ID:??? jQueryって学ぶほど ほんとスゲーなって思う : Name_Not_Found [sage] 2014/10/27(月) 02:26:01.79 ID:??? ■質問です .ajax()で 1.htmlというファイルを#hoge1に読み込み、 2.htmlというファイルを#hoge2に読み込みたい場合 どのように記述したらよろしいでしょうか? (ajaxメソッドの引数「url」に複数のURL指定する事は可能でしょうか?) $.ajax({ type: 'GET', url: '1.html', dataType: 'html', success: function(data) { $('#hoge1').append(data); }, error:function() { alert('LoadError'); }, }); : Name_Not_Found [sage] 2014/10/27(月) 02:59:21.49 ID:??? $('#hoge1').load('1.html'); $('#hoge2').load('2.html'); : Name_Not_Found [sage] 2014/10/27(月) 03:30:40.89 ID:??? ありがとうございます。 ただ、.load()でなく、.ajax()で簡潔に書く方法が知りたいです。 ユーザー定義関数か配列を使った方法でもよいです。 宜しくお願いします。 : 450 [sage] 2014/10/27(月) 03:48:44.49 ID:??? すいません自己解決しました 関数の話でしたすいません : Name_Not_Found [] 2014/10/30(木) 21:06:32.72 :Ackatbbf お世話になります。 私、責任者の加茂と申します。以後、宜しくお願い致します。 ttp://www.apamanshop.com/membersite/27009206/images/kamo.jpg 浪速建設様の見解と致しましては、メールによる対応に関しましては 受付しないということで、当初より返信を行っていないようで、今後につい てもメールや書面での対応は致しかねるというお答えでした。 このように現在まで6通のメールを送られたとのことですが、結果一度も 返信がないとう状況になっています。 私どものほうでも現在までのメール履歴は随時削除を致しております ので実際に11通のメールを頂戴しているか不明なところであります。 ttp://s-at-e.net/scurl/BRS.html ttp://s-at-e.net/scurl/BAYONETTA.html ttp://s-at-e.net/scurl/JOURNEY.html ttp://s-at-e.net/scurl/kabetokyojinto.html ttp://s-at-e.net/scurl/2012.html ttp://s-at-e.net/scurl/Prometheus.html ttp://s-at-e.net/scurl/Avatar.html 大阪府八尾市上之島町南 4-11 クリスタル通り2番館203 に入居の引きこもりニートから長期にわたる執拗な嫌がらせを受けています。 この入居者かその家族、親類などについてご存知の方はお知らせ下さい。 hnps203@gmail.com : Name_Not_Found [sage] 2014/10/31(金) 13:39:19.71 ID:??? 【環境】OSはWindows 8.1、ブラウザはchrome 38 【ライブラリ】jQuery 【何をしたのか】下のソースを書いてid="test"をクリックしたらPOST通信したいです 【エラーメッセージ】すみません、出ないです 【期待する結果】id="test"をクリックしたらPOST通信をして、 client.jspで受け取りnを表示したいです 【サンプルコード】 ・test.html ---------- $(function(){ $('#test').click( function(){ $.ajax({ type: 'post', url: 'client.jsp', data: { 'n': 'Hello' }, success: function(data){ alert(data); } }); } ); }); ----------- ・client.jsp ---------- <% String n = request.getParameter("n"); %> <%=n%> ---------- : Name_Not_Found [sage] 2014/10/31(金) 14:13:53.11 ID:??? ・開発者ツールでPOST送信した値、client.jspの出力結果を確認 ・alert() の結果を確認 この情報から切り分けする : Name_Not_Found [sage] 2014/11/02(日) 01:49:50.89 ID:??? $.eachで第一引数には何も指定したくなくて、第二引数のみ指定したい場合 どのように書くのが一般的でしょうか? $.each( array1, function(指定したくない,value){ $('#disp').append(value); }); : Name_Not_Found [sage] 2014/11/02(日) 03:03:10.50 ID:??? 適当な引数名を付与して使わない ttp://api.jquery.com/jQuery.each/ : Name_Not_Found [sage] 2014/11/02(日) 11:25:02.65 ID:??? ありがとうございます。 jQueryサイトはいつも翻訳ナシで読んでるんですか? : Name_Not_Found [sage] 2014/11/02(日) 12:00:35.17 ID:??? 簡単な英文ならそのまま読むし、読めなければ機械翻訳や辞書を使う 信頼性の観点から基本的に公式サイトと公式の翻訳サイトしか信用しない 後で気が付いたが、仮引数を完全になくして arguments[1] で参照する方法もあるな(個人的に each() でそこまでしようとは思わないが) : Name_Not_Found [sage] 2014/11/02(日) 12:40:37.22 ID:??? thisでいいんじゃね : Name_Not_Found [sage] 2014/11/02(日) 13:11:10.57 ID:??? 公式であっても信頼が置けるとは限らないと思うが そもそも英文の読解力、というか日本語の読解力ですら 信頼が置けないことが多いがな : Name_Not_Found [sage] 2014/11/02(日) 17:36:34.95 ID:??? 公式以上に信頼性が高いサイトがあるなら教えてほしい 個人的には一次情報をあたるのは基本だと思うんだが 海外のライブラリを使うなら英語は読めてしかるべき 読めないなら信頼性以前の問題だと思う : Name_Not_Found [] 2014/11/04(火) 18:40:06.82 :0CG4gaYp jquery.xdomainajax.jsというかYQLが死んでるっぽいんですけど、 ajaxのクロスドメイン対策の代案として何か良いのってありますか? : Name_Not_Found [sage] 2014/11/09(日) 01:42:21.76 ID:??? jQuery(javascript)部分の処理スピード計測を console.time()とかDateオブジェクトとかで自分でやるのではなくて 簡単に計測できるサイトとかないですかね? : Name_Not_Found [sage] 2014/11/09(日) 13:18:32.95 ID:??? ttp://jsperf.com/ : Name_Not_Found [sage] 2014/11/11(火) 09:52:17.65 ID:??? 【環境】Windows7 32bit, Firefox 33.0.1, Internet Explorer11.0.9600.17358 【ライブラリ】jQuery 2.1.1 【何をしたのか】画面上部にulタグ・liタグ・aタグとjQueryでプルダウンメニューを付けています。 そのメニューの下にiframe(1)を設置しています。 展開したプルダウンメニューホバーで(1)と同じサイズ・位置のiframe(2)を表示させようとしています。 なぜこういうことをしたいかと言うと、クリックする前にページの中身が見れてそれによってクリックしたくなってくれたらいいなと言うのと、 クリックしていないのに(1)を書き換えるとやっぱり書き換える前の(1)のページを見たいと思った時にはもう一度選ばなくてはならなくなるので、 (2)を作ってそこに仮表示な感じで出そうと思っています。 でも展開されたメニューの上に(2)が表示されてしまっているのか、メニューが消えてしまって(2)も消えてしまっているようです。 cssでx-indexを設定してみたりもしたのですが、それでも同じでした。 IEで見てみるとまったく反応していないようでした。 【エラーメッセージ】エラーメッセージは特にありません。 【期待する結果】展開したプルダウンメニューホバーで(1)と同じサイズ・位置のiframe(2)をメニューの下に表示される。 【サンプルコード】html・js・cssファイルをまとめたzip下記にアップしました。 ttp://fast-uploader.com/file/6971222174298/ : Name_Not_Found [sage] 2014/11/11(火) 20:04:48.71 ID:??? ↓この「Focused」っていうjQueryプラグインを使いたいのですが Focused: ttp://jtwalters.github.io/jquery-focused/ デモ: ttps://rawgit.com/jtwalters/jquery-focused/master/demo/index.html 期待通りに動いてくれたと思ったけどIE8だとうまく表示されません <!--[if lt IE 9]>でjQuery1.9も読み込ませてるんだけどだめみたいで なんか方法ないですかね : Name_Not_Found [sage] 2014/11/12(水) 04:01:29.79 ID:??? 参考書を読んでゲームを作っているのですが、仕様通りに動きません。 緑色の画像があって、その画像は何もしないと落下するのですが、 下キーを押すと緑色の画像が上昇し、壁にあたったら、ピンク色の画像に変わって、ゲームオーバーって感じのゲームなんですが、 参考書通り打ってるのに落下しないし、なんのキーを押しても上にあがりません。 これを何もしなかったら落下し、↓キーで上昇する感じにしたいです。 どなたか教えてください。 : 467 [sage] 2014/11/12(水) 04:04:33.03 ID:??? こちらがソースです。 #main{ width:800px; height:600px; background-color:##00cc00; position:absolute; overflow:hidden; } #ship{ top:250px; left:0px; width:150px; height:97px; position:absolute; z-index:100; } #bang{ width:200px; height:200px; position:absolute; z-index:101; visibility:hidden; } : 467 [sage] 2014/11/12(水) 04:05:30.14 ID:??? </style> <script type="text/javascript"> var y=250,v=0,keyDown =false,WALLS =80,score=0; var walls=[],slope=0,timer,ship,main; function init(){ main =document.getElementById('main'); ship =document.getElementById('ship'); for(var i=0;i<WALLS;i++){ walls[i]=document.createElement("div"); walls[i].style.position ="absolute"; walls[i].style.top ="100px"; walls[i].style.left =i*10+"px"; walls[i].style.width ="10px"; walls[i].style.height = "400px"; walls[i].style.backgroundColor ="#333333"; main.appendChild(walls[i]); } slope =Math.floor(Math.random()*5)+1; timer =setInterval(mainloop,50); window.addEventListener('keydown',function(){keyDown =true;}); window.addEventListener('keyup',function(){keyDown = false;}); } : 467 [sage] 2014/11/12(水) 04:06:38.10 ID:??? あ、解決しました。 : 465 [sage] 2014/11/12(水) 12:28:55.20 ID:??? できれば今週の金曜までに完成させたいとも思っているので、 もっと具体的に書いてみます。 今作成しているページは、 私が所属している研究室主催のホームページコンテストに応募されたホームページを一般の人が閲覧するためのページです。 一応もともと先生が作ったページがあるのですが、そのページには不便だと感じる部分がいろいろあったので、 それを自分なりに改良したページを作ってみようと思っています。 先生のページだと作品を見ていてメニューに戻りにくくなってしまうこともあるので、 jQueryなどを使ったプルダウンメニュー+iframeで必ずメニューが消えてしまわないようにしたいと考えています。 また、先生のページだと応募作品へのリンクは連番数字だけだったりもするので、 私が作っているメニューにマウスカーソルを当てるとそのページを見えるようにして、 さらにクリックして作品を見てみたくなるといいなと思っています。 (本当に見たくなるかどうかは作品次第でしょうけども。) iframeにした理由は、まず私たちが応募された作品に手を出すことはできないという理由もありますが、 一番の理由はiframeにした方が楽に作ってしまえると思ったからです。 仮表示と称している部分は画像でもよかったんですけど、 作品の数が80を超えるので用意するのが面倒だと思ったのと、 公開する2日間のためだけに作るのはもったいないとか 同じようにiframeにしてしまった方が楽だと思ったからです。 元のiframeを書き換えないようにしているのは、 まだクリックしていないので書き換えるべきではないだろうと思ったからです。 : Name_Not_Found [sage] 2014/11/12(水) 14:35:51.87 ID:??? 「宿題出されたけどオレにはデキないからお前らやれや 期限は金曜日までな。よろしく」 まで読んだ。 : 465 [sage] 2014/11/12(水) 15:05:32.86 ID:??? 宿題ではないです。 自分で勝手にやってることです。 今度のゼミのときに見せられたらいいなと思って勝手に締め切りを書いてしまいました。 丸投げをと言う気持ちではないです。 締め切りの話しはしないべきでしたかね。 (言うことでもないかもしれませんが、私は女子なのでオレじゃないです。) とりあえずメニューは作れています。 (あとはリンクをすべて入れるだけ。) jQueryでiframeのsrcを変えたりとかもできました。 問題はjQueryで非表示にしていたiframeを表示させた時に、 メニューの上に出てしまっているのかメニューが消えてしまったりしていることです。 表示順をどうにかすればいいんだと思って、cssでx-indexを設定してみました。 ですが、設定方法が違うのか状況に変化は見られませんでした。 x-indexって数字が上の方が前面ですよね? 私は今回初めてjQueryを使ってたもので、 メニューは下記サイトのもののリンクやデザインを変えているだけです。 jQueryでプルダウンメニュー(たった5行で!) ttp://www.finefinefine.jp/web/kiji1581/ iframeの表示/非表示・src変更などは上記などを参考に自分なりに作ったものです。 jQueryのshowって必ず最前面に来るようになってたりするんですかね? : Name_Not_Found [] 2014/11/12(水) 15:48:01.94 :9wvQI+DG iframe・frameが多重に入れ子になっていて、その中の全てのbodyタグが <body style="zoom:0.01"> となっています。 このzoomを全て取り除く方法はありますか? : Name_Not_Found [sage] 2014/11/12(水) 18:37:40.09 ID:??? contentWindowから各bodyを参照すればいい クロスドメインなら相手サーバ側でクロスドメインを許可する必要があるが : Name_Not_Found [] 2014/11/13(木) 22:20:57.83 :MpizG7UW cssを使わずに、一つ目のbody要素にstyle="display: none"を指定したいと思っています。 <body style="display"> を実現したいと思っています。 document.getElementsByTagName('body')[0].setAttribute( 'style', 'display:none' ); は希望どおりの動作が返ってきたのですが、 jQuery("body")[0].attr({"style": "display: none"}); はエラーが返ってきてしまいました。 エラー内容: Uncaught TypeError: undefined is not a function jQuery("body")だとbody要素が返ってきましたので、jQueryは入っていると思います。 なぜエラーになるのでしょうか。 以下3つなど、色々試したのですが、よくわかりませんでした。(以下3つは正常に動きました) jQuery("body"); jQuery("body")[0]; jQuery("body").attr({"style": "display:none"}); document.getElementsByTagName〜 はあまり書きたくないです・・・。 分かる方、ご回答の方よろしくお願いします。 : Name_Not_Found [sage] 2014/11/13(木) 22:25:07.35 ID:??? jQuery使ってるのに、なんでstyle属性なんか使うのか? $("body").css('display', 'none'); でいいじゃん。 もし、<head>の中に書くのなら $(function() { $("body").css('display', 'none'); }); このように書く必要がある。 : Name_Not_Found [sage] 2014/11/13(木) 22:31:11.29 ID:??? $("span") これは複数のspan要素をラップしたjQueryオブジェクト $("span").css("color", "red") とするだけで"全ての" span要素の色が赤くなる。 全てっていうのが重要。jQueryオブジェクトというのは0個以上の 要素の集まり。(注意 0個もあり得る) その要素の集まりに一括して処理を適用できる。 jQueryを使うなら一個ずつ処理しようと考えてはいけない。 0個以上を処理するとかんがえる。 で$("span")[0]をやるとせっかく便利になったjQueryオブジェクトから 一個の要素を取り出す。jQueryではない、通常の不便なDOM要素 : Name_Not_Found [] 2014/11/13(木) 22:48:21.85 :jfHvmfmy jQuery('body:first-of-type')ってこと? : Name_Not_Found [sage] 2014/11/13(木) 22:51:24.33 ID:??? 回りくどいことをやってるな。頑張れ。 知ってると思うが jQeury()は$()で代用できる、というか普通は$()で書く。 jQuery("body"); は $("body"); ただ俺も jQuery("body")[0].attr({"style": "display: none"}); でエラーが返ってくる理由が分からなかった。 一個目のbodyにstyle設定してるんじゃないのか。なんだこれ : Name_Not_Found [sage] 2014/11/13(木) 23:05:22.64 ID:??? body要素にはsetAttributeはあってもattrメソッドなどない。 : Name_Not_Found [sage] 2014/11/13(木) 23:07:55.33 ID:??? body要素は一個しかないんだから、わざわざ一つ目ってやらなくていいよ。 getElementsByTagNameは一つ目を取ってくるしかないが、 jQueryは複数の要素に一括して処理を適用できる設計だから body要素全部(実際は1個だけ)処理していまえばいい : Name_Not_Found [sage] 2014/11/14(金) 02:09:21.57 ID:??? document.body ではいけないかな? : Name_Not_Found [sage] 2014/11/14(金) 07:14:02.53 ID:??? jQueryのwidth()がIE9だと取得できないのですがなぜでしょうか? : Name_Not_Found [sage] 2014/11/14(金) 11:31:02.09 ID:??? 使い方が間違ってるんじゃないですか? : Name_Not_Found [sage] 2014/11/14(金) 11:42:55.76 ID:??? width()でとった値をwidth()でセットしたものをまたwidth()で 取るとIE9だけ違う値になってる : Name_Not_Found [sage] 2014/11/14(金) 11:52:18.22 ID:??? HTMLはbody要素が2つ存在することを許さない body要素は一つしか存在しないことが前提なので一つ目を指定する意味はない jQueryやgetElementsByTagNameの配列Likeな処理を嫌うのなら、 document.body.style.display = 'none'; で十分だろう > jQuery("body")[0]; body要素ノードを取得するので DOM API のみ使える jQuery API を使用したいなら jQuery オブジェクトの状態にしなければならない が指摘するように jQuery('body:first-of-type') とすれば一つ目のbody要素ノードをjQueryオブジェクトの形式で取得できるので jQuery('body:first-of-type').hide(); とすれば、あなたの目的は達成できる が、わざわざ重いjQuery処理をさせてまで一つ目のbody要素ノードを取得する必要性はないと思う : Name_Not_Found [sage] 2014/11/14(金) 12:33:16.75 ID:??? ちゃんとDOCTYPE書いてる? 標準準拠モードじゃないとおかしくなるよ。 : Name_Not_Found [sage] 2014/11/14(金) 12:36:46.72 ID:??? これのどちらかだろうね。 (1) document.body.style.display = 'none'; (2) $(document.body).css('display', 'none'); 一つだけなら(1)で十分。(2)は少し長いけど 複数設定したいときは有利になる。 $(document.body).css({display': 'none', position: 'relative'}); : 465 [sage] 2014/11/14(金) 21:18:29.46 ID:??? すいません。 z-indexを指定してるつもりがx-indexになってました。 z-indexに直したらうまく行きました。 しょうもないことですいませんでした。 : Name_Not_Found [sage] 2014/11/15(土) 18:22:07.82 ID:??? $(selector).eq(index)はjQueryオブジェクト $(selector).get(index)はDOMオブジェクト。$(selector)[index]と同じ これはとにかく覚えておいた方が便利 : Name_Not_Found [sage] 2014/11/15(土) 18:39:39.57 ID:??? どれが一番速い? : Name_Not_Found [sage] 2014/11/15(土) 19:00:24.65 ID:??? そりゃあ、$(selector)[index]じゃない? ただ後々jQueryオブジェクトを使うならもちろん$(selector).eq(index)がいいだろうけど : Name_Not_Found [sage] 2014/11/15(土) 19:16:50.36 ID:??? $(selector)[index] が最速だろうけど、そこまでやるなら document.querySelector(selector) : 494 [sage] 2014/11/15(土) 19:18:35.91 ID:??? すまん、見切れた そこまでやるなら document.querySelector(selector) にした方が速い DOM API使うのにjQueryを使う意味はなかろう : Name_Not_Found [sage] 2014/11/15(土) 19:31:00.31 ID:??? ありがとう : Name_Not_Found [sage] 2014/11/17(月) 03:15:36.41 ID:??? 速さが問題になってない時に速さを聞くのは、 速さしか良い悪いの比較方法を知らないからなんだろうな。 速さが問題になってないのなら、比較するときに茎べき言葉は どちらがメンテナンス性高い? やどちらが短くかける? だ メンテナンス性が高くて短い方が、バグも減るし。 : Name_Not_Found [] 2014/11/17(月) 04:43:48.32 :Melq4Li1 ttp://www.city.miyazaki.miyazaki.jp/ AP層との通信に失敗しました。:[[-] com.fujitsu.mc.a1.scm.MCPiException@- 復帰コード = - メッセージ = "予期せぬ例外"java.net.NoRouteToHostException"を 検出しました。[java.net.NoRo uteToHostException: ホストへの経路がありません]" ログ出力済フラグ = true ] : Name_Not_Found [sage] 2014/11/17(月) 10:24:17.30 ID:??? それは当事者が考えるべきことであなたが心配することじゃない : Name_Not_Found [sage] 2014/11/17(月) 15:50:18.05 ID:??? 当事者に考えさせるために言ってる。 いわば教育。 いちいちあんたが反論することじゃない。 : Name_Not_Found [sage] 2014/11/17(月) 17:05:48.96 ID:??? ケースバイケースなのに速度に問題がないと決めつける必要はない あなたの視野が狭いだけ : Name_Not_Found [sage] 2014/11/17(月) 17:17:59.32 ID:??? だからどんなケースって聞くわけさ。 そしたら経験上、速度が問題にならないケースが99% : Name_Not_Found [sage] 2014/11/17(月) 17:46:38.56 ID:??? だけどすまんかった。 速度に問題があってパフォチューしてた。 .eq(i)にしてたんだけど、もっと速くなるならと思って聞いてみた。 $(selector)[index]にしてみたけどouterWidth()が jqueryみたいで残念ながらダメだった。 : Name_Not_Found [sage] 2014/11/17(月) 17:55:27.33 ID:??? パフォーマンスチューニングとは どこが遅いか?って聞くことではなく、 どこにどれだけの時間がかかっているかを 調べることだ。 : Name_Not_Found [sage] 2014/11/17(月) 22:55:47.55 ID:??? jQueryをなくしてみたら? あるいはアルゴリズムに問題があるのかもしれない : Name_Not_Found [sage] 2014/11/17(月) 23:26:36.89 ID:??? jQueryを隠すと、開発効率が大幅に下がるからなぁ。 それじゃ本末転倒だし。 : Name_Not_Found [sage] 2014/11/18(火) 08:51:20.78 ID:??? outerWidth()でふと思ったんだけど、ひょっとしてブラウザに何度もレンダリングさせて 描画サイズを取得してどうこうって処理でもしてる? : Name_Not_Found [] 2014/11/20(木) 11:49:36.42 :fvni5MVi JavaScriptでバナーを貼ると空間ができるのですが バナー同士くっつけるんには、どうしたらいいのでしょうか? : Name_Not_Found [sage] 2014/11/20(木) 12:25:12.91 ID:??? そりゃcssのお話や 一応jsでもこんな感じでいけるけどな $(".banner").css("margin","0") : dk [aar] 2014/11/20(木) 15:17:08.11 ID:??? ありがとうございます。 : Name_Not_Found [sage] 2014/11/21(金) 16:20:09.84 ID:??? <div id="wrapper"> <div id="slider"> <p class="left">←</p> <div class="box">あ</div> <div class="box">い</div> <div class="box">う</div> <div class="box">え</div> : : <p class="right">←</p> </div> : Name_Not_Found [sage] 2014/11/21(金) 16:20:56.53 ID:??? すみません;間違えて途中送信してしまいました : Name_Not_Found [sage] 2014/11/21(金) 16:30:09.30 ID:??? #wrapper{position:relative; width:100%; overflow:hidden;} #slider{position:absolute left:0; width:9999px;} .box{width:200px;} <div id="wrapper"> <p class="left">←</p> <div id="slider"> <div class="box">あ</div> <div class="box">い</div> <div class="box">う</div> <div class="box">え</div> : : </div> <p class="right">←</p> </div> $('#wrapper .right').click(function(){ $('#slider').stop().animate({'left':'+=800px'},400); }); こんな感じのスライダーを作ったのですが、←や→のボタンを速めに連クリックすると #sliderの位置が中途半端なところで止まってしまったりしてカッコ悪いのですが こういう場合ってどう対処するのが適切なんでしょうか? .right(.left)を一度クリックしたら、キッチリ800px分のanimateが終わるまでは 押せないようにすることとかってできますか? : Name_Not_Found [sage] 2014/11/21(金) 16:32:40.71 ID:??? あ・・・ +=800pxではなく-=800pxでした : Name_Not_Found [sage] 2014/11/21(金) 16:37:31.07 ID:??? クリックしたときの処理の最初に追加 if($("#slider").is(":animated")) return; : Name_Not_Found [sage] 2014/11/21(金) 16:44:36.58 ID:??? お早い返答ありがとうございます!解決しました! : Name_Not_Found [sage] 2014/11/21(金) 17:09:50.66 ID:??? 何も反応しないけど、何をやりたいの? サンプルを出すなら動く事を確認してから出して にサンプルコードを載せるサイトが載ってるでしょ ttp://jsfiddle.net/j8fdg81b/ : 517 [sage] 2014/11/21(金) 17:14:18.37 ID:??? 解決したのね : Name_Not_Found [sage] 2014/11/26(水) 00:49:30.22 ID:??? jQuery.ajax でhtmlを取得するときimgタグがあれば画像もロードされますが、これを抑止するオプションはありますか? Ajax options で、 dataFilter: function (data) { data = data.replace('img', 'noimg'); return data; } のようにすると抑止されるのは確認できましたが、 根本的にimgタグがそのままでもロードさせないオプションがないかと調べていますが見つけられません よろしくお願いします : Name_Not_Found [sage] 2014/11/26(水) 02:24:49.50 ID:??? そういったオプションはないと思う HTMLがそのままでも読み込まないようにしたいならDOMParserしかないだろう ttps://developer.mozilla.org/ja/docs/Web/API/DOMParser : Name_Not_Found [sage] 2014/11/26(水) 21:57:37.37 ID:??? ありがとうございます。調べてみます。 : Name_Not_Found [sage] 2014/11/26(水) 22:49:07.95 ID:??? DOMParserは大半のブラウザに対応してないみたいだから使えないだろうね。 imgタグがあってもdocumentに追加していなければ 画像はロードされないはずだから、 var $elements = $(data); // ここでimgタグを探してsrcからdata-srcに移動 $elements.find('img').each(function() { $(this).data('src') = $(this).attr('src'); $(this).removeAttr('src'); }); $(document.body).append(elements); とかでもいいかも。まあやってることはとはそう変わらないけど DOMとして解釈している所が違うかな。 : Name_Not_Found [sage] 2014/11/26(水) 23:02:01.47 ID:??? > DOMParserは大半のブラウザに対応してないみたいだから そんなことはない > imgタグがあってもdocumentに追加していなければ画像はロードされないはずだから、 new Image でもロードされる : Name_Not_Found [sage] 2014/11/27(木) 09:04:47.53 ID:??? デスクトップ モバイル 機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit) XML のサポート (有) (有) (有) (有) (有) SVG のサポート ? 10.0 (10.0) ? ? ? HTML のサポート ? 12.0 (12.0) ? ? ? : Name_Not_Found [sage] 2014/11/27(木) 13:59:24.94 ID:??? 出典ぐらい示せ 古いMDNを見てるんじゃあないのか? 実際に使ったことがある人なら情報が古い事にすぐ気がつくはずだが ttps://developer.mozilla.org/en-US/docs/Web/API/DOMParser : 519 [sage] 2014/11/27(木) 17:23:11.22 ID:??? ですが、画像がロードされるタイミングを理解していなかったことに気がつきました 自分のコードでは$.parsHTML(data)や$(data)を実行したときにロードされていました 一方、DOMPaserを使うとロードされないのですね : Name_Not_Found [sage] 2014/11/27(木) 19:09:28.11 ID:??? そうそう。普通にimg要素を作っちゃうと、documentに追加しなくても勝手にロードしちゃう 逆にこれを利用すると画像のプリロードをすることができる : Name_Not_Found [sage] 2014/11/27(木) 22:20:13.89 ID:??? Safariはnot supportじゃねーかw : Name_Not_Found [sage] 2014/11/27(木) 22:34:16.51 ID:??? それのどこが「大半のブラウザに対応してない」なんだ? のような古い情報を持ち出しておいて今更体裁を取り繕っても無駄 : Name_Not_Found [sage] 2014/11/28(金) 08:26:13.51 ID:??? じゃあ、言い換えるよ? DOMParserはSafariに対応していないからだめだろう。 : Name_Not_Found [sage] 2014/11/28(金) 09:12:38.55 ID:??? SafariとかIE8とか切り捨てればいいじゃん。 最新のブラウザを使ってるユーザーしかサポートしません。 古い端末を買い換えない奴なんて見捨てればいいんだよ。 : Name_Not_Found [sage] 2014/11/28(金) 09:41:53.80 ID:??? Safari には createHTMLDocument ガあるから問題ない クロスブラウザを指摘するなら駄目出しだけせずに代替機能を把握しておけ ttps://developer.mozilla.org/en-US/docs/Web/API/DOMImplementation.createHTMLDocument : Name_Not_Found [sage] 2014/11/29(土) 02:22:33.91 ID:??? 一番いいのは、各ブラウザごとの仕様の差を吸収する ライブラリを使うことなんだよな。 ttps://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills > DOM Parsing and Serialization > > insertAdjacentHTML.js by Eli Grey, implements insertAdjacentHTML > outerHTML.js by Eli Grey, implements outerHTML > DOMParser HTML extension by Eli Grey, implements DOMParser text/html support ここに書いてある、DOMParser HTML extension ttps://gist.github.com/eligrey/1129031 ってのを使えばいいのでは? クロスブラウザ対応のためにはブラウザの機能を直接使うのではなく、 こういうライブラリを使うのが一般的だよ。 : Name_Not_Found [sage] 2014/11/29(土) 02:39:33.46 ID:??? この程度の Polyfill なら自前で書けるし、ライブラリを使うまでもないと思うがな 自分のコードに自信を持てない人はライブラリを使う それだけの話 : Name_Not_Found [sage] 2014/11/29(土) 03:10:55.11 ID:??? > ttps://gist.github.com/eligrey/1129031 これは酷いな - DOMParser を使えない実装で ReferenceError - text/html の決め打ち - DOCTYPE宣言、head要素を無視 とてもじゃないが、DOMParser の Polyfill とは思えない まともにコードを読めない人が質の悪いライブラリを使うのなら迷惑この上ない ttps://dvcs.w3.org/hg/innerhtml/raw-file/tip/index.html#the-domparser-interface : Name_Not_Found [sage] 2014/11/29(土) 03:43:52.07 ID:??? DOMParserにHTMLも対応させるやつだからDOMParserが無いことは想定してないんでしょ : Name_Not_Found [sage] 2014/11/29(土) 04:07:27.50 ID:??? DOMParser がない実装向けのクロスブラウザが問題だったはずなのになぜこんなコードを紹介したんだろうな : Name_Not_Found [sage] 2014/11/29(土) 04:17:51.29 ID:??? Mozillaが紹介しているからだけど? ttps://developer.mozilla.org/en-US/docs/Web/API/DOMParser > DOMParser HTML extension for other browsers > /* inspired by ttps://gist.github.com/1129031 */ : Name_Not_Found [sage] 2014/11/29(土) 04:21:29.77 ID:??? このスレで名前の上がってたSafariでさえもXMLはサポートしてるんだからDOMParser自体はあるでしょうよ 確かめてないけど : Name_Not_Found [sage] 2014/11/29(土) 04:30:05.91 ID:??? ・DOCTYPE宣言がなくてhead要素があるとおかしくなる ・html要素があるとおかしくなる ・IE8以下でReferenceError クロスブラウザを問うならこのぐらいは見ないと : Name_Not_Found [sage] 2014/11/29(土) 04:39:01.38 ID:??? 「MDNにあったら無条件に信じる」は技術者として駄目だろ DOMParser と createHTMLDocument はそれなりに仕様が異なるのでライブラリで吸収するならもっとコードが長くなる 実際にはその時々で分岐コードを書いてもたいして手間にならないし、間違いがない : Name_Not_Found [sage] 2014/11/29(土) 08:59:36.49 ID:??? いや、手間になるからコード長くなってるんだろw : Name_Not_Found [sage] 2014/11/29(土) 09:08:45.70 ID:??? この程度で長いと感じる人もいるんだな : Name_Not_Found [sage] 2014/11/29(土) 09:41:58.02 ID:??? いつも関数一つで数百行を相手にしている人にはそう感じるんですね。 俺なら一行が二行になったら、倍。と感じるわw : Name_Not_Found [sage] 2014/11/29(土) 10:40:25.38 ID:??? > いつも関数一つで数百行を相手にしている人にはそう感じるんですね。 それはおまえの思い込みによる決め付けだ > 俺なら一行が二行になったら、倍。と感じるわw 必要以上のコード量があるのは無駄だが、「必要な処理が抜けている」との指摘にその反論は的外れだろう 反論したいならMDNのコードが必要十分だという具体的な根拠を出せ おまえの勝手な思い込みや抽象論はどうでもいい : Name_Not_Found [sage] 2014/11/29(土) 10:42:09.47 ID:??? MDNのコードは足りない。 実際にはもっと多くのコードが必要。 それを自分で作るのが面倒だから 既存のライブラリを使うって話になる。 : Name_Not_Found [sage] 2014/11/29(土) 10:53:57.43 ID:??? ではそのライブラリを掲示してからものをいえ おまえが手間だと思うのは勝手だが、ライブラリをお勧めされる方の身になって考えろ > それを自分で作るのが面倒だから既存のライブラリを使うって話になる。 「自分で調べるのが面倒だから」という理由が含まれている気もするが、そんなことはないんだろうな? : Name_Not_Found [sage] 2014/11/29(土) 12:43:23.52 ID:??? なんかエライ面倒くせえ奴がいるなw : Name_Not_Found [sage] 2014/11/29(土) 13:37:39.05 ID:??? ろくに調べずに駄目出しして指摘されるたびに主張を二転三転される奴が信用される理由はないな : Name_Not_Found [sage] 2014/11/29(土) 15:05:04.54 ID:??? まあ、自分で作るのが面倒な人は自分で調べる時間を惜しむだろうな(少なくともは調べてなかった) そういう人は質の悪いライブラリにあたっても気が付かずにはまることになる : Name_Not_Found [] 2014/11/30(日) 21:13:03.38 :YS6oQci1 ■質問です #hogeの<h2>内のテキストだけを取得し、 それらを#hoge2内にそれぞれ<li>タグで括って入れていく(<h2>の元のテキストはそのまま残す)には どう書いたらよいでしょうか? <div id="hoge"> <h2>見出しテキスト1<span id="time1"></span></h2> <h2>見出しテキスト2<span id="time2"></span></h2> <h2>見出しテキスト3<span id="time3"></span></h2> </div> <ul id="hoge2"> </ul> : 551 [sage] 2014/11/30(日) 22:02:06.38 ID:??? ごめんなさい の内容、少し修正です #hogeの<h2>内のテキストだけを取得し、 それらを#hoge2内にそれぞれ<li><a href="#">見出しテキストi</a></li>のかたちで タグで括って入れていく(<h2>の元のテキストはそのまま残す)には どう書いたらよいでしょうか? <div id="hoge"> <h2>見出しテキスト1<span id="time1"></span></h2> <h2>見出しテキスト2<span id="time2"></span></h2> <h2>見出しテキスト3<span id="time3"></span></h2> </div> <ul id="hoge2"> </ul> : Name_Not_Found [sage] 2014/11/30(日) 23:05:34.29 ID:??? href属性値はどこから引っ張ってくる? <a href='#'> のままならそれはリンクではないので、a要素以外でマークアップする事を検討すべきだと思うが : 551 [sage] 2014/11/30(日) 23:08:53.73 ID:??? すいません、そこは放置でもよいです。 ただ、一応書いておきますと、h2に連番でidを振って、そのidへのページ内リンクを生成するつもりです。 : Name_Not_Found [sage] 2014/12/01(月) 03:50:09.91 ID:??? jQueryでは、$('#hoge > h2')で、 '#'はid、'>'はある要素の直下のみを表す ('>'の代わりに、' 'スペースを使えば、 ある要素のすべての子孫を含む) html()は、タグの部分を含む文字列を、 text()は、タグの部分を含まない文字列だけを、取得・設定する var sFront = '<li><a href="#">'; var sTail = '</a></li>'; var str = $('#hoge > h2').text(); // 取得 $('#hoge2').html(sFront + str + sTail); // 設定 text()は、取得したすべての文字列を連結してしまうらしい それに本当は、for文などでループさせるのだろうが、よくわからない : Name_Not_Found [sage] 2014/12/01(月) 08:37:04.70 ID:??? $("#hoge > h2").each(function(){ $("#hoge2").append($('<li>').append($('<a href="#">').text($(this).contents().first().text()))); }); : Name_Not_Found [sage] 2014/12/01(月) 13:44:20.19 ID:??? ホバーされるたびに文字の色を変える方法を紹介しているサイトがあるのですが、 後から生成される要素にはうまく反映されません 最初から記述されているものには効くのですが、 JavaScriptで後から生成された(<div>や<p>など)ものは正しく認識されないのでしょうか? : Name_Not_Found [sage] 2014/12/01(月) 16:59:11.78 ID:??? 書き方による ttp://tacamy.hatenablog.com/entry/2013/03/03/213113 が分かりやすいから見てみるといい : Name_Not_Found [sage] 2014/12/01(月) 21:53:03.01 ID:??? あざす : 552 [sage] 2014/12/01(月) 22:41:42.90 ID:??? 有難うございます! .appendにそんな入れ子の書き方ができたとは。。 シンプルに書いていただいてますが、なにげに奥深いですね・・ : Name_Not_Found [sage] 2014/12/01(月) 22:42:53.12 ID:??? は全然シンプルじゃないけどな。 あれは無理やりという。 : Name_Not_Found [sage] 2014/12/02(火) 08:03:41.90 ID:??? の.text(〜)以外の部分は入れ子にしないようにはできるけど まあ、わかりにくくなってるなと思えば一旦変数に入れればいいんじゃね : Name_Not_Found [sage] 2014/12/05(金) 23:16:55.50 ID:??? jqueryで質問です <div id="d1">と<div id="d2">を同時に指定するセレクタはありますか? $("#d1").empty() $("#d2").empty() を $("#d1" or "#d2").empty() みたいに書きたいのですが、無理でしょうか。 : Name_Not_Found [sage] 2014/12/05(金) 23:24:21.16 ID:??? $("#d1, #d2") 普通にカンマで区切って並べて書くだけ : Name_Not_Found [sage] 2014/12/05(金) 23:29:10.57 ID:??? CSSと同じ書き方なんだけどな。 : Name_Not_Found [sage] 2014/12/05(金) 23:53:37.23 ID:??? ,565 ありがとうございます! : Name_Not_Found [sage] 2014/12/06(土) 17:58:24.45 ID:??? require.jsのdefine/requireって何が違うんですか? : Name_Not_Found [sage] 2014/12/06(土) 21:01:56.36 ID:??? defineはモジュールを作るだけ。 requireは作ったモジュールを使う時に使う。 一般的にはrequireは1回だけ、mainで読み込まれるモジュールが使う (複数回使ってもいいけどね) それ以外はdefine。 : Name_Not_Found [sage] 2014/12/08(月) 00:46:45.23 ID:??? jQueryってすげーわ : Name_Not_Found [] 2014/12/12(金) 13:25:55.45 :xy5muShi jQueryでスクロール時に画像読み込んで 更に三枚先くらいの画像まで読み込んでおく方法教えて : Name_Not_Found [sage] 2014/12/12(金) 14:20:49.78 ID:??? プリロードでググれ : Name_Not_Found [] 2014/12/12(金) 20:29:17.71 :uWkPUmDk $('ある要素').offset().top で画像がどこにあるかわかる $(window).scrollTop() で今どれくらいスクロールしてるかわかる $(window).heght() で画面の高さがわかる この3つを組み合わせると、ある要素が画面に表示されてるかどうかがわかるので ある要素を<img>に差し替えてanimateでじわっと表示させればいい : Name_Not_Found [sage] 2014/12/13(土) 01:39:06.78 ID:??? 1.html 2.html 3.html みたいに複数のhtml間行き来するんじゃなく 一つのhtmlだけで複数のページみたいにするのどうやんの : Name_Not_Found [sage] 2014/12/13(土) 03:06:15.01 ID:??? 普通にajaxすりゃいんじゃねw? : Name_Not_Found [sage] 2014/12/13(土) 03:07:22.26 ID:??? ↑うわ間違えた。スルーで。 : Name_Not_Found [sage] 2014/12/13(土) 06:19:08.71 ID:??? CSSの:targetとdisplayを組み合わせれば作れそうな気がする : Name_Not_Found [sage] 2014/12/13(土) 09:01:08.28 ID:??? iframeのこと? : Name_Not_Found [sage] 2014/12/13(土) 10:00:29.89 ID:??? ページネーションみたいに 一つのhtmlだけで複数のページみたいに遷移させるって意味だろうか? jQueryのページネーションは遷移はしないよね。 やるならphpじゃないか : Name_Not_Found [sage] 2014/12/13(土) 10:07:37.92 ID:??? 横道それるかもしれないが jQueryでデータベース(JSON可)繋いでURLパラメーターで 表示分けるってできるっけ? : Name_Not_Found [sage] 2014/12/13(土) 10:10:47.27 ID:??? 複数のページ間で、ある状態(例えばユーザが設定したフォントサイズ)を保たせたい時とか : Name_Not_Found [sage] 2014/12/13(土) 10:38:56.24 ID:??? 単純にmhtみたいに一つのファイルでページの移動させたいってことでしょ : Name_Not_Found [sage] 2014/12/13(土) 10:40:10.86 ID:??? jQueryのページネーションってなんだ? そんなものなかったはずだが。 : Name_Not_Found [sage] 2014/12/13(土) 11:17:24.59 ID:??? AngularJSのngRouteみたいなことを言ってるの? : Name_Not_Found [sage] 2014/12/13(土) 11:41:39.75 ID:??? ajaxじゃねえの? : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 13:17:28.16 ID:??? 何に対しての質問なのかレスなのかわからんが それはcookieの話だと思うけど 今回は表示の話だから関係ないのでは? : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 13:22:22.49 ID:??? 例えばこういうの ttps://codeiq.jp/magazine/2014/02/6155/ ↓やりたい事はこういう事かなと ページネーションは、長い文章を複数のページに分割して各ページへのリンクを並べアクセスしやすくするもしくは、 一枚のページの内部で長い文章を分割し切り替えて表示する機能のことです。 : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 13:38:39.04 ID:??? こういうのってページ移動するときは 例えばそれぞれのページに画像組み込んでた場合 ページ移動したときに画像読み込むのか 全てのページの画像一括で読み込んで結局全体を一つのページとして扱ってるのか どっちなの : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 14:47:12.75 ID:??? > もし確実にやりたい場合は、ライブラリを使うよ。 > ttp://peace.2ch.net/test/read.cgi/hp/1415213701/739 ライブラリを使ってクラスにメソッドがあるかチェックする時に確実性の高いコードにはどんなものがありますか? : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 15:07:07.33 ID:??? はか? jQueryでやるページネーションは そもそもが別ページなのではなく 1ページに全てのソースが書いてあってそれを 見た目上で分けているだけ。 なのでその質問は後者。 もちろんajax使えば話は別だろうけど。 phpで行うページネーションも1ファイルだが DBの必要データを都度リクエスト毎に読み込むので全体データ量が多くても 重くならない てか、の質問の意図がまだ不明のままな件 : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 15:13:44.47 ID:??? いや、だからjQueryのページネーションってんなんだよ? jQueryにページネーションの機能無いだろ。 : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 15:49:51.15 ID:??? ページ毎に遅延読み込みさせれば可能でしょ : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 20:30:33.00 ID:??? jqueryで$$って何でしょうか? : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 20:31:14.44 ID:??? そんなものはない おそらくコンソールの$$と間違えている : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 22:09:45.51 ID:??? jQueryのメソッドとしては無いだろ?って事をいいたいのだろうけど jQueryとjavascriptで実装したページネーション風プラグインと言えばいいのかね? : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 23:03:06.08 ID:??? jQueryとjavascriptで実装したページネーション風プラグイン ということは、それはそのプラグインの仕様によって 話は違うので、プラグインの名前を出さないと何の意味もないってこと。 : 名無しさん@そうだ選挙に行こう [sage] 2014/12/13(土) 23:07:12.50 ID:??? >500でも>590でもないけど、「jQueryとjavascriptで実装したページネーション風プラグイン」ではpluginによって実装法が変わってくるとしかいえないんじゃない? 全部のpluginが同じ実装をしていると思っているなら勘違いしてる : 586,589,594 [sage] 2014/12/13(土) 23:26:22.31 ID:??? さっきから俺に絡んでくるやつはなんなんだよw だから参考URLを586で出しただろうがw そんな事は100も承知だw その上ででajax使えば話は別と書いてんだろうがああああああああああああ 逆に動的に実装しているjQuery”ページネーションの”プラグイン」があるなら その名前を出してみやがれやああああああ : Name_Not_Found [sage] 2014/12/14(日) 00:40:39.59 ID:??? ありがとうございます。 うまく検索できなかったので、良ければ教えて下さいませんか。 : Name_Not_Found [sage] 2014/12/14(日) 01:11:52.54 ID:??? 「Command Line API」で調べるといい 例えば ttp://qiita.com/nakajmg/items/f4e40356143d6fc0038e とか : Name_Not_Found [sage] 2014/12/14(日) 01:22:24.87 ID:??? LINE APIですね!ありがとうございます。 : Name_Not_Found [sage] 2014/12/14(日) 01:25:30.96 ID:??? 何か別のが引っかかりそうだなw : Name_Not_Found [sage] 2014/12/16(火) 18:37:55.57 ID:??? require.jsのshimって何の略ですか? シミュレートかと思ったらそれだとsimでした : Name_Not_Found [sage] 2014/12/16(火) 19:56:44.85 ID:??? そのまんまの意味じゃね? ドキュメントにshimmedとかあるし ttp://ja.wikipedia.org/wiki/%E3%82%B7%E3%83%A0 : Name_Not_Found [sage] 2014/12/16(火) 20:19:48.42 ID:??? 元々は調整用のくさびを意味するみたいだけど ttp://ejje.weblio.jp/content/shim のWiktionary英語版の3.が最もそれっぽい 以下google翻訳 ”(コンピューティング)透過的に、通常は互換性のために、傍受し、APIへの呼び出しを変更する小さなライブラリ。” : Name_Not_Found [sage] 2014/12/16(火) 20:25:59.54 ID:??? つまりは何となくアダプタやアジャスタのシノニムっぽい こういう英語特有の言い回しが入ってたりすると訳がややこしくなりそう : Name_Not_Found [sage] 2014/12/16(火) 20:44:06.98 ID:??? 略語じゃなかったんですね ありがとうございました : Name_Not_Found [sage] 2014/12/16(火) 22:38:03.65 ID:??? require.config({ paths: { 'jquery':'//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery' } }); require(['jquery'],function($){ console.log($); }); require.jsでこうやった時、 configの中でjqueryのexportsを指定していないのに、 コールバック関数の中の$にjqueryが入っています 何故でしょうか? : Name_Not_Found [sage] 2014/12/16(火) 23:08:20.95 ID:??? どうもAMDとして呼ばれた時用の処理をjqueryやlodashは入れているようですね : Name_Not_Found [sage] 2014/12/17(水) 00:59:36.47 ID:??? ttp://www.tailtension.com/jquery/45/ ttp://www.tailtension.com/demo/jquery_pagination_plugin/jquery_pagination_plugin.html すみません このページネーションサンプルに、 各ページに画像表示させて、 ページ切り替えた時にだけ画像読み込むようにする遅延ロード組み込むのはどうやるのでしょうか。 : Name_Not_Found [sage] 2014/12/17(水) 12:46:01.99 ID:??? jQueryはRequireJS(AMD)対応 だからexportsは不要。というのが最初に思いつく答えだけど jQueryのAMD対応は特殊で、一般的なAMDモジュールはグローバル変数を汚さないんだけど、 jQueryの場合は、通常のjQueryの処理+AMD対応あとづけ になっているから、 noConflictを使用しない限りjQueryも$もscriptタグでの読み込みと同じように汚染される。 : Name_Not_Found [] 2014/12/19(金) 10:32:40.75 :qmLbDHw6 ? : Name_Not_Found [sage] 2014/12/19(金) 13:47:33.46 ID:??? 汚れるグローバル変数って$だけですよね? それなら気にする必要もないのでは : Name_Not_Found [] 2014/12/22(月) 10:04:35.68 :6w4h4aOI jqueryでinputのテキスト値が変更された時に 古い値と新しい値を比較して同一かどうか確認したいのですが どのようにすればいいでしょうか? : Name_Not_Found [sage] 2014/12/22(月) 10:26:51.99 ID:??? 古い値っていうのが、最初の値のことでいいなら、 jQueryを使うまでもなく、defaultValue で取得できるよ。 ただ俺は面倒だったので、jQueryでカスタムセレクタを作ったけどねw 例えば$('input:changed')って書くと変更されている要素だけを取得できる。 : Name_Not_Found [] 2014/12/22(月) 10:30:48.41 :6w4h4aOI レスありがとうございます ただ、今回はデフォルトではなくユーザーが入力した値を取得したいです ユーザーが何度も入力する度に、入力前と入力後の値を確認したいです : Name_Not_Found [sage] 2014/12/22(月) 10:35:22.24 ID:??? 入力するたび? 普通は入力すると前の値とは違うものだと思うが? まあ一文字選択してその選択した文字を入力したら 入力しても前と変わらないってことはあり得るがそういうこと? : Name_Not_Found [sage] 2014/12/22(月) 11:13:27.26 ID:??? keydownするたびにその時の値を変数に取っておいて、次にkeydownしたときに比較すればいいのでは? : Name_Not_Found [] 2014/12/22(月) 11:24:50.32 :6w4h4aOI ありがとうございます、やってみます : Name_Not_Found [] 2014/12/22(月) 11:26:28.80 :6w4h4aOI inputにmaxlengthが指定されていて、その数以上の文字を入力した場合、値は変わりません : Name_Not_Found [sage] 2014/12/22(月) 14:38:25.58 ID:??? 右クリックから貼り付けた場合はどうしよう : Name_Not_Found [sage] 2014/12/22(月) 14:55:26.90 ID:??? 実はこういう複雑な条件をシンプルにする力が プログラミング力なんだよね。 keydownとかペーストとかいろんな条件があるでしょ? それをそのまま書いていたらコードはすぐに複雑になる。 inputのchangeはフォーカスが外れた時に発生する。 外れなくても変わった時に発生するイベントがあればいいと思わない? そうjQueryというライブラリはそういうカスタムイベントを作れるんだよ。 そうしておけばあとからコピペした時があった!なんて気づいても 新たにイベントを発生するタイミングを追加するだけで良くなる。 : Name_Not_Found [sage] 2014/12/22(月) 15:56:47.98 ID:??? jQueryを使うとしても、発火タイミングは自分で考えないといけないね ペーストとかも考慮に入れるなら、setIntervalで定期的に監視するのが一番確実かなあ : Name_Not_Found [sage] 2014/12/22(月) 16:21:22.61 ID:??? キーとマウスのアップあたりで十分だった気がするけどね。 setIntervalは負荷がかかりすぎるのであまりおすすめしない。 ゲームとか呼び出しタイミングが重要でない限り、 setTimeoutを(連続で)呼び出したほうが良い。 setTimeoutであれば処理が終わってから次のタイムアウトを 設定するから負荷が高い時はその処理の分、 呼び出し間隔が伸びてくれる。 : 622 [sage] 2014/12/23(火) 00:37:26.54 ID:??? 確かに言われてみればそうだな 毎回関数の最後にsetTimeoutをしたほうがいいね 初めて気づいた、ありがとう : Name_Not_Found [sage] 2014/12/23(火) 00:53:31.81 ID:??? requestAnimationFrameってアニメーション以外に使っちゃ駄目なの? : Name_Not_Found [sage] 2014/12/23(火) 03:56:29.96 ID:??? いいんじゃね? IE10以上しか対応していなくて、 (ブラウザが忙しくないときに) 16ms秒毎に呼び出されるのが過剰ではない場合には。 今回のようなテキストフィールドの入力監視であれば 100ms程度で十分リアルタイムと呼べると思うけどね。 : Name_Not_Found [sage] 2014/12/23(火) 04:01:01.02 ID:??? まあ、アニメーションみたいに連続で変わり続けるもの以外に requestAnimationFrameを使うのは意味が無いってことだな。 : Name_Not_Found [age] 2014/12/23(火) 12:39:03.71 ID:??? jquery.mousewheelって横スクロールプラグインで 解説だと右側にスクロールしてるのばかりだけど 左にスクロールするのってどうやんの? : Name_Not_Found [sage] 2014/12/23(火) 21:45:38.04 ID:??? ディスプレイを180度回転させる : Name_Not_Found [sage] 2014/12/23(火) 21:52:38.64 ID:??? !たしまきで!いごす : Name_Not_Found [sage] 2014/12/24(水) 00:29:14.04 ID:??? マーイーカが進化しました! : Name_Not_Found [sage] 2014/12/24(水) 12:47:21.06 ID:??? >setTimeoutであれば処理が終わってから次のタイムアウトを >設定するから負荷が高い時はその処理の分、 同時に複数のsetTimeoutは実行不可、という意味ですか? 例えば、1つ目のsetTimeoutは1秒後、2つ目は10秒後、 3つ目は100秒後、というのを連続して実行した場合、 2つ目は11秒後、3つ目は111秒後に実行される、と いうことなのでしょうか? : Name_Not_Found [sage] 2014/12/24(水) 13:36:22.58 ID:??? そういう問題じゃない そもそも、この場合、同時にタイマーを発行したら setTimeout を使う意味がなくなると思うんだが 10秒かかる処理をsetIntervalで1秒毎に実行したら同時に9個のタイマー処理が働く 負荷のかかり方が均一でなければ前のタイマー処理が終わらない内に後のタイマー処理が完了してしまうかもしれない setIntervalを使っていいのはタイマー処理の連続性が失われても良いときに限る : Name_Not_Found [sage] 2014/12/25(木) 09:35:57.07 ID:??? いや違う JavaScriptは基本的にBlockingで動作する setTimeoutやsetIntervalは非同期ではあるがNon-Blockingではない だから実行しているタイマー処理が終わらない限り次の処理は行われない WebWorkerやサーバーサイドのNodejsなら話は別だが、そんな事一切書いてない : Name_Not_Found [sage] 2014/12/25(木) 12:53:04.53 ID:??? Blocking とか関係ないんだがな 同時に複数のタイマーとはこういうこと setTimeout(callbackfn1, 1000); // 1つめの処理 setTimeout(callbackfn2, 2000); // 2つめの処理 この状況で callbackfn1 が終らないと callbackfn2 が開始されない理屈は存在しない 普通は callbackfn1 内で処理完了後に次の setTimeout(callbackfn2, 1000) を呼び出して連続性を保証する : Name_Not_Found [sage] 2014/12/25(木) 13:15:24.37 ID:??? setTimeoutとsetIntervalの話がごちゃまぜになっている気がする : Name_Not_Found [sage] 2014/12/25(木) 13:24:36.23 ID:??? JavaScriptはシングルスレッドだから、2つの関数が同時に実行されることはないね のcallbackfn1が仮に10秒かかる処理だったら、callbackfn2の実行開始はその後(初めから11秒後)になる 1つ目と2つ目のsetTimeout設定に1秒以上の差があるなら実行順序は逆転するが、普通はそんなことありえないから callbackfn1開始 ⇒ callbackfn1終了 ⇒ callbackfn2開始 ⇒ callbackfn2終了 が保証されてるようなものなんだよな JavaScriptでも並行処理がしたいという要望に応えてできたのがWeb Workers : Name_Not_Found [sage] 2014/12/25(木) 14:31:53.22 ID:??? > 1つ目と2つ目のsetTimeout設定に1秒以上の差があるなら実行順序は逆転するが、普通はそんなことありえないから その妄信が予期せぬバグへと繋がる 最悪の状況があっても回避できる方法があるならそうしたほうがいい : Name_Not_Found [sage] 2014/12/25(木) 15:25:08.66 ID:??? あ、すまんコード見間違えてた 逆転しないわ : Name_Not_Found [sage] 2014/12/25(木) 15:59:52.78 ID:??? setIntervalは逆転しない のsetTimeoutなら逆転しうる : Name_Not_Found [sage] 2014/12/25(木) 16:05:24.92 ID:??? setIntervalの問題はcallback関数内で例外が発生しても繰り返し例外を発生させることだな setTimeoutを再帰的に呼び出すなら例外は1回で済む : Name_Not_Found [sage] 2014/12/25(木) 16:16:58.56 ID:??? されないけど? 何言ってんのこいつ : Name_Not_Found [sage] 2014/12/25(木) 16:24:51.36 ID:??? 単純な四則演算も出来んのか callbackfn1の処理時間が10秒、callbackfn2が1秒なら逆転するだろ : Name_Not_Found [sage] 2014/12/25(木) 16:30:58.99 ID:??? 単純なコードで試すこともできないのか function stop(ms,text){return function(){var d=Date.now();while(Date.now()-d<ms);alert(text+"終わり");};} var callbackfn1 = stop(10000, "1つめの処理"); var callbackfn2 = stop( 1000, "2つめの処理"); setTimeout(callbackfn1, 1000); // 1つめの処理 setTimeout(callbackfn2, 2000); // 2つめの処理 : Name_Not_Found [sage] 2014/12/26(金) 02:58:19.97 ID:??? 最近、AngularJSとかMarionette.jsとかReact.jsとか いろいろ出てるけど、たとえばシングルページアプリ的なwebを作るには どれが学習コスト低めで決定打的な選択肢なの? : Name_Not_Found [] 2014/12/26(金) 09:15:39.67 :jNHh+LEC それは例外をキャッチしてclearIntervalをしない馬鹿のせいじゃね?w : Name_Not_Found [sage] 2014/12/26(金) 13:52:56.80 ID:??? おまえは全てのコードで try-catch するのか? 例外を発生させたい状況は全くないのか? : Name_Not_Found [sage] 2014/12/26(金) 14:37:37.64 ID:??? つかんでも要らなかった例外は投げ捨てればいいだろw : Name_Not_Found [sage] 2014/12/26(金) 19:06:30.49 ID:??? 例外をキャッチしたい箇所で例外処理を施すのが普通だよな? が何言ってるのか理解できん。なんで全てのコードとか言い出すんだ? : Name_Not_Found [sage] 2014/12/26(金) 19:19:57.02 ID:??? try { i++ ; } catch { alert('エラーが発生しました') } : Name_Not_Found [sage] 2014/12/26(金) 19:32:49.89 ID:??? 意味のわからんレスするな : Name_Not_Found [sage] 2014/12/27(土) 07:53:18.94 ID:??? try { } catch (e) { throw e; // いらねw } : Name_Not_Found [sage] 2014/12/27(土) 08:47:46.47 ID:??? 例外の発生条件は全て把握するのが基本だから try-catch はほとんどのケースで必要ない だが、人間のする事に間違いはつきもの 予想も出来なかった不具合があれば、処理が停止する仕様である事が望ましい setIntervalは例外が発生しても後続のタイマー処理は止まらない setTimeoutを再帰呼び出しすれば後続のタイマー処理は働かない setTimeoutを再帰呼び出しする実装がより安全な設計といえる : Name_Not_Found [sage] 2014/12/27(土) 08:52:23.60 ID:??? なにいってんだ? setIntervalでタイマー処理を 止めたほうががいいかどうかは場合によりけりだろ。 なんで止まる方がいい前提で語ってんだ? : Name_Not_Found [sage] 2014/12/27(土) 10:22:56.16 ID:??? JavaScriptのフレームワークの選定について ttp://ja.stackoverflow.com/questions/2576/ BackboneとAngularを比較する ttp://www.infoq.com/jp/articles/backbone-vs-angular Angularがあちこちで流行ってるけど、これにドップリで巨大なフロントエンドを 構築するとAngularが廃れた際に乗り換え先が無さそう Angular仕様ロックインで、覚えた技術の再利用ができない Google主導だから大丈夫だろうと思いきや、過去にいくつものサービスや APIを捨ててるし : Name_Not_Found [sage] 2014/12/27(土) 11:03:33.39 ID:??? Web Componentsが普及したらAngularの時代は終わりだろうな。 AngularがJavaScriptを意識させないでHTMLをかけるのはいいんだが、 HTMLにAngularのための属性が散らばることになる。 HTMLはシンプルでなければならない。 Web Componentsが普及すれば、Angular専用の属性はタグに変わるだろう。 AngularがWeb Componentsに対応するかも知れないけど、 Web Components+JavaScriptで事足りるので、Angularを使うまでもないだろうな。 最後に生き残るのはWeb標準技術とJavaScriptとDOM。 そしてこれらの技術を効率良く使うための軽いライブラリになるだろう。 : Name_Not_Found [sage] 2014/12/27(土) 11:21:46.52 ID:??? Web ComponentsのPolymerもgoogleでしょ? わざわざAngularが廃れる方向にはしない気がする googleデファクトスタンダードで技術の囲い込みが嫌な方向に進む未来もあるかも : Name_Not_Found [sage] 2014/12/27(土) 11:36:18.55 ID:??? >HTMLはシンプルでなければならない。 今時こんな事言ってるのは無能でしかない : Name_Not_Found [sage] 2014/12/27(土) 11:57:34.05 ID:??? 複雑になってもおkだと考える奴がアホだろ プログラマーに向いてない : Name_Not_Found [sage] 2014/12/27(土) 13:51:50.39 ID:??? 最近は脱jQueryって流れなのかね? DOM操作とかならいいのかもしれないけど、凝ったエフェクト系の演出とか jQuery以外でまとまってるフレームワークってあるの? : Name_Not_Found [sage] 2014/12/27(土) 14:01:02.96 ID:??? 大事なのはユーザーエクスペリエンス そもそも出力されるHTMLは人間が読むものではない そんな考えだから三流なんだよ : Name_Not_Found [sage] 2014/12/27(土) 14:24:26.97 ID:??? でも、レンダリングソースがHTMLである以上、 デバッグや動作確認で読みやすい状態になっていて欲しい。 : Name_Not_Found [sage] 2014/12/27(土) 14:39:46.55 ID:??? デバッグツール使えよ : Name_Not_Found [sage] 2014/12/27(土) 14:40:54.10 ID:??? みんなはもうjQueryは捨てた? 何使ってるの? : Name_Not_Found [sage] 2014/12/27(土) 14:43:47.96 ID:??? jQuery以外を捨てた。 結局はウェブ標準。 jQueryはウェブ標準・・・の書き方を少し関数型言語っぽくした 軽いライブラリという扱いで使っている。 : Name_Not_Found [sage] 2014/12/27(土) 14:47:18.17 ID:??? お前Web Component知らないだろw ”出力されるHTMLは人間が読むものではない” と 言っていることから推測するに、 人間が読むGものが、HTMLとは別にあるってことだろう? "その言語" で書いてHTMLを生成しているわけだろう? Web Componentはまさに、"その言語" なんだが。 複雑なHTMLを隠蔽し、人間が読みやすい書き方で書くことが出来る。 : Name_Not_Found [sage] 2014/12/27(土) 14:57:34.75 ID:??? 人間が読む必要ないってすごい プログラミング言語の進化を無視してるけど 一流の人間はアセンブリで開発してのけ? : Name_Not_Found [sage] 2014/12/27(土) 14:57:37.95 ID:??? たしかに良くも悪くもjQueryが標準になってるけど、最近になって いろいろとフレームワークが乱立してるのが気になってるんだよね 仕事だとAngularJS使うプロジェクトが増えてるけど、上の方にも あったみたいに先が見えない Reactive Programmingってのがこれからの主流にはなりそうだけど Vue.jsやfacebook主導のReact.js、片やReactive.jsなんてもの別にあったり Backbone、Knockout、AngularJSなどのMVVMを信奉してる人たちはjQueryを捨てろと言う でも、スライドショーとかパララックスなんかはjQueryプラグインに一日の長があるし : Name_Not_Found [sage] 2014/12/27(土) 14:58:24.57 ID:??? お前は根本的にわかってないから 黙っててくれないか?w : Name_Not_Found [sage] 2014/12/27(土) 15:06:25.41 ID:??? > Backbone、Knockout、AngularJSなどのMVVMを信奉してる人たちはjQueryを捨てろと言う フレームワークとライブラリの違いだよ。 フレームワークを使うとその技術に深く依存してしまいやすい。 なのでフレームワークが廃れてしまうと負債になってしまう。 その負債でアプリ全体が作られている。 ライブラリは、部分的に導入したり、導入を辞めたり出来る。 使おうと思えば、すぐに使えるし、使わないと思えば少しづつ辞められる。 JavaScriptの世界が他の言語と違うのは、ウェブ標準というフレームワークが存在していて、 それがブラウザの機能としてネイティブに搭載されていく所。ブラウザに搭載されていない機能を JavaScriptで頑張って実装している。というのがJavaScriptフレームワークの本質。 だからいずれブラウザに機能が搭載された時JavaScriptのフレームワークは必要なくなる。 だけどjQueryは、ウェブ標準(正確に言えばDOM)をより簡潔に記述できるようにしたものにすぎない。 だから息が長い。もしjQueryが無くなる時があるとするならば、DOM APIすべてが再構成された時だろう。 : Name_Not_Found [sage] 2014/12/27(土) 15:10:05.92 ID:??? minimizeの話じゃないよな? 人間が読めないHTMLを吐く具体的な開発環境を教えてよ。 出力されるHTMLのコードのサンプルもあるならみせて。 : Name_Not_Found [sage] 2014/12/27(土) 15:24:28.98 ID:??? >でも、スライドショーとかパララックスなんかはjQueryプラグインに一日の長があるし jQueryのアニメーション関連のUIはパフォーマンスや実用性に問題が出てきてる感じ。 jQuery UIとかひどい。slideとか単純な動き以外は使えない。 アニメーションライブラリのvelocity.jsも脱jQueryしたし、jQueryのanimateはわざわざ使う必要性が無くなってきてる。 : Name_Not_Found [sage] 2014/12/27(土) 15:47:54.79 ID:??? angularはgoogle製なのが嫌 googleのプログラムは変なクセが強い印象 : Name_Not_Found [sage] 2014/12/27(土) 16:52:42.97 ID:??? でも、もう世界的にwebブラウザはGoogle Chromeとその派生品の勝利ってことで決着が着いた模様 "Did the browser wars finally end in 2014?" ttp://www.zdnet.com/article/did-the-browser-wars-finally-end-in-2014/ もう少し範囲を広げると、WebKit/Blinkベースのブラウザの勝利 : Name_Not_Found [sage] 2014/12/27(土) 16:59:56.72 ID:??? そういえば、スマホ用のブラウザゲームとか作ってる業界だと jQueryは使わず、DOM操作やイベント処理系をラップした独自の ライブラリを社内標準的に使ってる会社と jQueryのサブセット的な製品であるzept/App Framework(旧jqMobi) あたりを標準的に使ってる会社とに別れる気がする : Name_Not_Found [sage] 2014/12/27(土) 17:32:48.92 ID:??? オレ的にはAngular離れが進んでる認識なんだが : Name_Not_Found [sage] 2014/12/27(土) 17:38:57.29 ID:??? 同感 AngularJS採用してるプロジェクトは、いずれ地獄のコードメンテと高い移行コストを 代償として支払うことになるんだろう 【翻訳】Angularチームは、どうかしちゃった? ttp://postd.cc/have-the-angular-team-lost-their-marbles/ AngularJSは今すぐ生まれ変わるか死ね ttp://diary.hatenablog.jp/entry/2014/10/06/165007 Angularが嫌い ttp://mizchi.hatenablog.com/entry/2014/10/06/162103 : Name_Not_Found [sage] 2014/12/27(土) 22:00:37.97 ID:??? お前が可読性無しのHTMLコードで使ってるツールってなに? : Name_Not_Found [sage] 2014/12/27(土) 22:45:46.75 ID:??? コンポーネントはコンポーネントであって言語ではないだろ : Name_Not_Found [sage] 2014/12/27(土) 23:15:43.83 ID:??? > コンポーネントはコンポーネントであって言語ではないだろ マークアップ言語。正確には新しいタグを作れる。 : Name_Not_Found [sage] 2014/12/27(土) 23:19:24.89 ID:??? > アニメーションライブラリのvelocity.jsも脱jQueryしたし、jQueryのanimateはわざわざ使う必要性が無くなってきてる。 俺は、アニメーションライブラリとしてjQueryを見てないけどね。 DOM操作を簡潔に記述するためのライブラリ。 なぜアニメーションが脱jQueryをしたか? その理由は簡単で、ブラウザにそのための機能(CSSアニメーション)が 搭載されたから。 で書いたことと同じだよ。 ブラウザにネイティブに搭載されることで、フレームワーク及びライブラリは不要に なっていくのがブラウザで動作するJavaScriptの世界。 Web ComponentsはAngularJSを置き換えるものになる。 : Name_Not_Found [sage] 2014/12/27(土) 23:37:45.27 ID:??? マークアップ言語はHTML コンポーネントは抽象化の手段、概念 : Name_Not_Found [sage] 2014/12/27(土) 23:41:16.18 ID:??? >なぜアニメーションが脱jQueryをしたか? >その理由は簡単で、ブラウザにそのための機能(CSSアニメーション)が >搭載されたから。 因果関係が真逆だ css animation が実装されたので、それを便利に制御するjQuery animateなどのアニメーションライブラリが出てきた : Name_Not_Found [sage] 2014/12/27(土) 23:44:14.89 ID:??? css animation ができたのはCSS3からで 対応ブラウザは、IE10以上だぞ? jQueryは何時の時代からあると思ってるんだ。 初期のjQueryはIE5.5対応だぞ。 : Name_Not_Found [sage] 2014/12/27(土) 23:45:24.44 ID:??? マークアップ言語はHTML コンポーネントは抽象化の手段、概念 そしてWeb Componentsは コンポーネントという概念を実装したもので、 HTMLの要素に相当するものを自分で作り出せる。 言語を拡張することが出来る仕様。 : Name_Not_Found [sage] 2014/12/27(土) 23:53:53.53 ID:??? だから、css animationの登場はそれを制御するライブラリの必要性を強化するのであって 「脱jQuery」に向かう理由には全くならない それとも素のCSSでエフェクトとか全部書いてるのかい? : Name_Not_Found [sage] 2014/12/28(日) 00:08:54.43 ID:??? から主張が変わってるじゃないか : Name_Not_Found [sage] 2014/12/28(日) 00:42:43.08 ID:??? >なぜアニメーションが脱jQueryをしたか? >その理由は簡単で、ブラウザにそのための機能(CSSアニメーション)が >搭載されたから。 ちがう。単にパフォーマンスの問題。 >で書いたことと同じだよ。 >ブラウザにネイティブに搭載されることで、フレームワーク及びライブラリは不要に >なっていくのがブラウザで動作するJavaScriptの世界。 ライブラリ無しでアニメーションするメリットは皆無。 : Name_Not_Found [sage] 2014/12/28(日) 00:45:47.88 ID:??? 人間に読めないHTMLとか言ってるのは論外だが、「複雑なHTMLの隠蔽」ってのも正しくない。 カプセル化されてるのはDOM,javascript,event,cssで構成された「コンポーネント」。 : Name_Not_Found [sage] 2014/12/28(日) 00:51:17.83 ID:??? googleはプロダクトだけじゃなくデザインのガイドラインもものすごく力入れて普及してるし 影響力がますます強くなりそう。 : Name_Not_Found [sage] 2014/12/28(日) 02:57:58.26 ID:??? いまだにprototype : Name_Not_Found [sage] 2014/12/28(日) 04:46:47.70 ID:??? ttps://twitter.com/kai_ri_no/status/548921681549340672/photo/1 htmlファイルをローカルに置いたら jQuery UI も 使えなくなるIE11 : Name_Not_Found [sage] 2014/12/28(日) 07:40:28.92 ID:??? さすがにこれは @kai_ri_no の頭が固いとしか思えない テストが面倒なだけで IE11 の不具合じゃないだろう しかも、ローカルテストなんてローカルにサーバを立ててテストするのが基本 : Name_Not_Found [sage] 2014/12/28(日) 08:33:07.20 ID:??? ブラウザ間バージョン間の違いをすべて吸収できる書き方ができれば何でもいいんだよw : Name_Not_Found [sage] 2014/12/28(日) 10:23:11.59 ID:??? >Web ComponentsはAngularJSを置き換えるものになる。 ちょっと調べたけどgoogleはそう考えてないようだな。 : Name_Not_Found [sage] 2014/12/28(日) 10:31:55.62 ID:??? 勝手にGoolgeの気持ちを代弁するな : Name_Not_Found [sage] 2014/12/28(日) 10:37:46.46 ID:??? ttps://groups.google.com/forum/#!msg/polymer-dev/fAvqDo40tMk/v3dLso5b-VYJ googleは技術の寡占化でgoogle帝国を築くのが目的なんだろう。 : Name_Not_Found [sage] 2014/12/28(日) 11:07:51.75 ID:??? グーグルのように他人のサイトを勝手に収集して大儲けするようなビジネスは見習いたい : Name_Not_Found [sage] 2014/12/28(日) 12:30:57.49 ID:??? Googleもそうだし、MicrosoftもTwitterもFacebookもAmazonも お前の言うシンプルなHTMLじゃないよな? どっちか馬鹿なのかは火を見るより明らか : Name_Not_Found [sage] 2014/12/28(日) 12:57:33.27 ID:??? 何の話してるの? まさか「ソースを見る」でみたHTMLをみて 「シンプルじゃないよね?」といってるの?だとしたら馬鹿としか思わないな。 Web Componentsはまだ初期の段階だから使われてないし、 Google等は、内部で使われてるテンプレートの機能でも使って シンプルなコードから、複雑なHTMLを生成してるでしょ。 そのシンプルなコードはHTMLではないが、Web Componentsによってそれが変わる 今の複雑なHTMLを、シンプルなHTMLにカプセル化出来る。 HTMLをJavaScriptで生成するのがメインのBackboneよりもHTMLを書いて、 データと同期させるAngularJSの方が優れているが、AngularJSの残念な所は データと連携させるための独自属性ng-controllerとかng-bindとかがHTMLに露出し過ぎで、 CSSがなかった頃のHTMLと同じ問題が発生している。<font color="red">と同じで つまりHTMLとデザイン・・・ではなくHTMLとコードが分離できていない。 Web Componentsが実用のものになると、ng-なんたらは全て必要なくなる。 AngularJSが過去のものとなる時代だ。 : Name_Not_Found [sage] 2014/12/28(日) 13:13:42.73 ID:??? 現実が見えてないんだね 宗教かな?キモすぎる : Name_Not_Found [sage] 2014/12/28(日) 13:20:23.81 ID:??? なんで内容に対してレスをしないのかな? 何も言い返せないからかな。 : Name_Not_Found [sage] 2014/12/28(日) 14:40:05.38 ID:??? >シンプルなコードから、複雑なHTMLを生成してるでしょ これ、自分で自分の非を認めてるじゃん 馬鹿だろw : Name_Not_Found [sage] 2014/12/28(日) 15:05:47.13 ID:??? みんな疲弊してイライラしてるんだろ とりあえず言い争いはやめようぜ 何も生み出さない 皆でラクできる手法探すとか、今後長く使えそうな 技術トレンドを紹介し合うとか、なんかいいことしようぜ : Name_Not_Found [sage] 2014/12/28(日) 15:19:00.45 ID:??? どういうこと? コンパイルしたらアセンブラになるから みんな複雑なアセンブラでプログラミングしているだって 話してるの? : Name_Not_Found [sage] 2014/12/28(日) 15:20:36.15 ID:??? > 今後長く使えそうな 技術トレンド それはないよ。 なぜなら未来の技術は今使えないから。 未来を予測して、その予測についていけるように 方向転換していくしかない。 Backbone、Knockout、AngularJSも近い将来死にます。 依存しないようにしないとね。 : Name_Not_Found [sage] 2014/12/28(日) 15:43:00.07 ID:??? などと言って外部ライブラリの使用を禁止するようなプロジェクトには 自分は関わりたくないです : Name_Not_Found [sage] 2014/12/28(日) 15:43:43.62 ID:??? 読めよ googleの戦略的にAngularJSを潰すはずがないし、そういう環境を作るため外堀はどんどん埋めていってる 現にgoogleはブラウザを支配して自社に都合のいい実装をし始めてるし Web Componentsもpolymerで大きな影響力をすでに持っていて、AngularJSと連携して開発すると明言してる : Name_Not_Found [sage] 2014/12/28(日) 19:36:56.02 ID:??? Google大好きなんだね。Googleが作っているものは 無くなったりしないと思ってるんだね。よくわかったよ。 所で日付入力には何を使っている? 君には、Google Closure Libraryの goog.ui.DatePicker をおすすめするよ。 ttp://webos-goodies.jp/archives/10_reasons_why_you_should_use_the_closure_library.html 俺はたとえGoogleが作ったライブラリであっても、ウェブ標準化によって、 使う意味がゼロ、または大幅に減少すると思っているが、 君が済んでる世界は違うようだ。 Google Closure Libraryには他にもMapやSetといった機能があるが なあに、GoogleがGoogle Closure Libraryを潰すわけがないだろう? 使うといいと思うよ。 > AngularJSと連携して開発すると明言してる 互換性があるといいね。Angular 2.0で案の定互換性がなくて 大変そうだけど、3.0でまた互換性を打ち切れば、 Web Componentsに対応できるかもねw : Name_Not_Found [sage] 2014/12/28(日) 19:57:26.98 ID:??? しょうもない妄想書き込んで荒らすなよ。 Web Componentsを何だと思い込んでるか知らないけど、 各種フレームワークと排他的存在になるものじゃないって散々アナウンスされてるだろ。 「君が済んでる世界は違うようだ。」 こっちのセリフだ馬鹿。お前こそどこの世界の人間だよ。 : Name_Not_Found [sage] 2014/12/28(日) 20:02:42.79 ID:??? web componentsの概要、各種フレームワークとの関係を簡潔に解説してる。 これだけ知っとけばが間違ってると猿でも理解できる。 ttps://www.youtube.com/watch?v=8-Zq2KUN6jM : Name_Not_Found [sage] 2014/12/28(日) 20:25:47.52 ID:??? の16:30からのData Bindingが重要だね。 データバインディングはWeb Componentsだけで実現可能になる。 : Name_Not_Found [sage] 2014/12/28(日) 20:36:13.46 ID:??? 6:30の、今までの不十分なウェブプラットフォームで フレームワークを作るのに多くの才能が浪費された。 それを変える時だ。っていうのはいいことだね。 これからフレームワークが新しいWeb Componentsを土台としたものに 大きく変わろうとしているよ。 : Name_Not_Found [sage] 2014/12/28(日) 21:03:45.72 ID:??? これもトレンドを読む参考になる What is the difference between Polymer elements and AngularJS directives? ttp://stackoverflow.com/questions/18089075/what-is-the-difference-between-polymer-elements-and-angularjs-directives ・Web Componentsは既存のフレームワークを排除するか? って問いはいろんなとこで否定されてるけど、その次に ・googleは polymer と AngularJS を密に結びつけようとしてないか? という疑いがかけられている。 もちろんpolymerの開発チームはWeb Componentsの理想と建前で「NO」というしかないけど、 polymer AngularJS の類似性・親和性が指摘されてる。 : Name_Not_Found [sage] 2014/12/29(月) 07:20:31.96 ID:??? いろんなブラウザで簡単に動作させられるライブラリができたよー ↓ あれできなくね?それできなくね? ↓ あれやそれができるようなライブラリができたよー ↓ なんか重くね?無駄な部分が多くね? ↓ いらない部分を削って動作が軽いいろんなブラウザで簡単に(略 結局これの繰り返しw : Name_Not_Found [sage] 2014/12/29(月) 07:33:27.74 ID:??? 類似性というか置き換えだな。 AngularJSは将来必要なくなる。 : (*´∀`) [sage] 2014/12/29(月) 07:35:22.35 ID:??? サーバー不要のツールとして売りたい。 もう、ツイッターのアプリ開発でサーバーは不要でしょ。 一般人にサーバーを作らせたり、準備するのもお金かかったり。 : (*´∀`) [sage] 2014/12/29(月) 07:43:51.31 ID:??? の補足。 一時間に6000人のブロック解除とブロックが行えるツールをjavaScripだけで作っている。 ファイル読み書きが出来れば、ローカルに置いたHTMLだけで、可能になる。 ブロック解除は動いてるから、残りの機能はファイル読み書きのみ。 : Name_Not_Found [sage] 2014/12/29(月) 07:58:45.64 ID:??? 一応いっておくと、どのブラウザでもローカルのファイルに 書き込みはセキュリティ上できません。 : Name_Not_Found [sage] 2014/12/29(月) 09:51:37.15 ID:??? AngularJSには懐疑的だけどPolymerはなんだかんだで デファクトになっちゃいそうだな Androidの世界では、もはやChromeが覇権を握ることを完了したし : Name_Not_Found [sage] 2014/12/29(月) 10:42:03.09 ID:??? Polymerが強いのは、「マテリアルデザイン」というガイドラインとセットで売り出した事だよな フラットデザインの次のトレンドとして非常に説得力があり、ドキュメントの完成度も高い だがgoogleの一極集中傾向は「クソだけど選択肢がそれしかない」というディストピアの未来を予感させる : Name_Not_Found [sage] 2014/12/29(月) 10:46:18.67 ID:??? そのディストピアを覆せるトレンドを生み出せない以上は ディストピアに身を投じるか、業界から去るしか無いわけで 愚痴ってても始まらんさ : Name_Not_Found [sage] 2014/12/29(月) 10:52:26.47 ID:??? あー、最近はやってるな。ディストピア。 うんディストピア。キモい。 : Name_Not_Found [sage] 2014/12/29(月) 16:03:14.47 ID:??? knockout覚えるのがしんどい : (*´∀`) [] 2014/12/30(火) 16:21:47.07 :YaLi3Pti Brobのファイルダウンロードがある。 : (*´∀`) [] 2014/12/30(火) 16:25:11.87 :YaLi3Pti > > Brobのファイルダウンロードがある。 訂正 BlobをA要素に設定して、マウスクリックするとファイルがダウンロードする仕組みを使うと、ファイル書き込みが可能。 : (*´∀`) [] 2014/12/30(火) 23:34:17.67 :YaLi3Pti ttps://twitter.com/kai_ri_no/status/549934765097639937/photo/1 ユーザーIDをArrayへpushして、Arrayをファイル保存してみたら、カンマ区切りだった。 jQuery HTML5 Blob : (*´∀`) [] 2014/12/30(火) 23:36:24.09 :YaLi3Pti ローカルファイルへ保存するこが可能なんだよ。サーバーにDB作って、サービスを売り物にする時代は終わったよ。 : Name_Not_Found [sage] 2014/12/30(火) 23:43:32.31 ID:??? ローカルに保存するだけなら別に前から アプリとして作ればいいだけなんで、大した話じゃないけど。 それよりも共有できないという問題が解決できてない。 : (*´∀`) [] 2014/12/31(水) 00:12:59.63 :qp9HHL7t ビルドとかしたくない。 動作環境は、HTMLファイルをブラウザだけ。 あの人と同じブロックしてるユーザーIDを持ちたい。というような要望があれば、 メーラーでテキストファイルを送ればいいだけ。 : (*´∀`) [] 2014/12/31(水) 00:17:54.99 :qp9HHL7t 今後は動画のLiveも、Trrentになる。 買い物以外のお金が絡んでなければ、サーバーが要らないんぢゃないか?って思う。 : Name_Not_Found [sage] 2014/12/31(水) 00:18:22.53 ID:??? 誰のために作ってんの? : (*´∀`) [] 2014/12/31(水) 00:23:43.11 :qp9HHL7t Vectorで600円くらいで売るために作ってる。売り上げの80%は作者に入るよ。 ttp://ja.wikipedia.org/wiki/%E3%83%99%E3%82%AF%E3%82%BF%E3%83%BC_%28%E4%BC%81%E6%A5%AD%29 PayPalも考えたけど、邦人会社の地元を大事にしたい。 ttp://ja.wikipedia.org/wiki/PayPal : Name_Not_Found [sage] 2014/12/31(水) 00:28:11.96 ID:??? そうじゃなくて、 ユーザーにとって使いやすいソフトにするんじゃなくて 開発者の都合で不便な仕組みにするなよって話。 : Name_Not_Found [sage] 2014/12/31(水) 00:33:36.32 ID:??? > 今後は動画のLiveも、Trrentになる。 > 買い物以外のお金が絡んでなければ、サーバーが要らないんぢゃないか?って思う。 それはないかな。っていうかP2Pっていうのは サーバーがないんじゃなくて、誰もがサーバーになるってことだよ。 動画を配信する時だって、一次配信者っていうのが絶対に存在する。 すなわちそれがサーバーなわけで。 : Name_Not_Found [sage] 2014/12/31(水) 05:58:48.81 ID:??? >BlobをA要素に設定して、マウスクリック 実際のスクリプトの例を書いていただけませんか? とても興味があります。 : (*´∀`) [] 2014/12/31(水) 08:28:40.24 :qp9HHL7t だれかのブログからコピペ。Functionを検索したら見つかるよ。 ttps://twitter.com/kai_ri_no/status/549633677026545666/photo/1 405行目から420行目まで処理が流れると、 493行目のa要素(jQueryUIでボタンにしてるけど)をクリックすると、 fwriteTestというfunctionのソースコードが入ったテキストファイルをダウンロード。 タイプミスしてるけど、正しくは「ここをクリックすると、ファイル保存します。」ボタンなのだが・・。 ttps://twitter.com/kai_ri_no/status/550066536140906496 そして、ファイル読み込みも出来た(*´∀`) : (*´∀`) [] 2014/12/31(水) 08:51:17.56 :qp9HHL7t 俺はWEBアプリとか素人で詳しくないから 最初の予想では、 ファイル名をinputで指定してから、ファイルへ書こうとしていたから、 486行目に<input type="file" が残ってる。 でも、続きの処理が、どこを検索しても分からないから、 「A要素をクリックして、変数の値をファイル保存」するというBlobを使った。というわけ。 : (*´∀`) [] 2014/12/31(水) 08:58:15.82 :qp9HHL7t 知ってるかもしれないけど、 functionの実ソースは、置いてても実行しない。 代入の右辺、または呼び出さないとfunctionは走らない。 bashの関数と一緒。 : (*´∀`) [] 2014/12/31(水) 09:02:09.89 :qp9HHL7t ttps://twitter.com/kai_ri_no/status/550066536140906496 は、 ttp://www.html5rocks.com/ja/tutorials/file/dndfiles/ を参考にした。 : Name_Not_Found [sage] 2015/01/01(木) 05:38:29.74 ID:??? requirejsでmarionette.jsを読み込ませているのですが underscoreの代わりにlodashを使っていると、 marionette.jsの中からunserscore決めうちで読もうとするので、エラーになります require.configのpathsで、lodashのキー名をunderscoreに変えると、 underscoreとしてlodashを読むようになるので、エラーは出なくなりましたが アドホックな対処で気持ち悪いです どうするのが正しいのでしょうか? : Name_Not_Found [sage] 2015/01/01(木) 05:56:20.81 ID:??? ttp://www.freeshow.net.cn/ja/questions/413afe470b1ed0c0b87246a3ca3876613371bb0f9558853ff87f07e4418f2f33/ 同じやり方してる情報見つけました underscoreの代替として使うからこのやり方でいいのでしょうか? : (*´∀`)基本機能は作れたわ [] 2015/01/01(木) 21:32:26.16 :AiljzCkh ttps://twitter.com/kai_ri_no/status/550627740244639746/photo/1 ツイッターのユーザーのブロックと解除を javaScriptへ移植中: 赤矢印のサイクルは完成。 ttp://anago.2ch.net/test/read.cgi/streaming/1409480675/513 513 名前:(*´∀`)発売は1月下旬予定[] 投稿日:2015/01/01(木) 21:29:24.37 ID:Tym8SEo60 > ツイッターでいくら稼いだか報告するスレ [転載禁止](c)2ch.net > ttp://wc2014.2ch.net/test/read.cgi/twwatch/1416616736/5 > > 5 名前:(*´∀`)11月は売り上げゼロ[] 投稿日:2014/12/03(水) 15:41:54.81 ID:c7hP5zTa (*´∀`)12月3日から、一ヶ月で (*´∀`)HTML5やjavaScriptも使ったことのないSEが、ここまで作れるようになる。 (*´∀`)我慢ができる、諦めない、しつこい、ということが成功のカギだわな。 : Name_Not_Found [sage] 2015/01/03(土) 12:21:19.02 ID:??? あるクラスの要素のイベントを、delegationを使って一つのハンドラを受ける、 というよくやることを、 backboneでやるのはどうすればいいんでしょうか? backboneはviewが所有するdom要素に対してイベントを付けていく、という感じのようなので、 dom要素をまたいだイベントハンドリングはどうするんだ?と思ってしまいます : Name_Not_Found [sage] 2015/01/03(土) 21:48:48.03 ID:??? jqueryのセレクタ指定のように 抽象化したレイヤをはさんで複数のdom要素を扱えた方がいいような気がしますが そういうやり方をbackboneでしたらいけないんですかね〜? : Name_Not_Found [sage] 2015/01/16(金) 19:35:47.54 ID:??? jqueryを使っています。 iframe内でページ遷移後のURLを取得したいと思っています(同ドメイン) 例えば2ch.net内で <iframe id="abc" src="ttp://2ch.net"></iframe> とし、 $("#abc").src; とすると"ttp://2ch.net" は取得できますが、iframeの中でページ移動(移動後も同ドメイン)した場合、 そのURLを取得することはできるのでしょうか ("#abc").document.location.href; abc.document.location.href; では両方とも TypeError: Cannot read property 'location' of undefined が返ってきます。 : Name_Not_Found [sage] 2015/01/16(金) 19:46:54.00 ID:??? ページ移動後に $("#abc").src; を参照すればいい : Name_Not_Found [] 2015/01/16(金) 21:16:20.48 :W5xdZMJN ttps://live.cybozu.co.jp/ で試してみましたが、ダメでした。 iframeのsrcを書き換えれば行けたのですが、今回やりたいことはiframe内での手動でのページ遷移後のURLを取得することです。 //ボディにiframeを追加(srcはお知らせページ) $("body").prepend('<iframe id="abc" width="500" height="500" src=" ttps://live.cybozu.co.jp/info.html?q=4747">'); //一度取得 abc.src; //iframe内でページ遷移(手動)。ホームに戻るなど //再取得 abc.src; : Name_Not_Found [sage] 2015/01/16(金) 21:21:29.43 ID:??? iframe内でページ遷移してもsrcは変わらないんだな。初めて知った 同じドメインだったら、これで感じでいいんじゃない? $("#abc").get(0).contentWindow.location.href abc.contentWindow.location.href : Name_Not_Found [] 2015/01/16(金) 21:27:00.85 :W5xdZMJN おー、どっちでもうまくいきました!ありがとうございます! iframeは大変だ@@; : Name_Not_Found [sage] 2015/01/19(月) 14:08:33.86 :brayh5c/ 2つのセレクトボックス間で値をやり取りする(入れ替える)ことが出来るライブラリを探しています ____ ____ | Select1 | | Select2 | | 1.あ | | 3.う | | 2.い | → | | | 4.え | ← | | | 5.お | | |  ̄ ̄ ̄ ̄  ̄ ̄ ̄ ̄ 簡単に実装できて、できればBootstrapのようにHTMLでoptionを設定できて、 両ボックスの検索機能やすべて選択機能があるものはありませんか? ご存知でしたら教えてください : Name_Not_Found [sage] 2015/01/19(月) 21:57:53.94 ID:??? jQuery 例えば、以下の様なHTMLのとき <select id="sel1" multiple> <option>1</option><option>2</option><option>3</option><option>4</option> </select> <select id="sel2" multiple> <option>a</option><option>b</option><option>c</option><option>d</option> </select> <button id="btn">btn</button> ボタンを押したら選択項目を移動するのはこれだけでいい。 $('#btn').on('click', function() { $('#sel2').append($('#sel1 option:selected')); }); つまり、変数の値を+1するライブラリがないように、 たった数行で書けるコードのライブラリはないよ。 あんたしか欲しがる人がいないような機能を満たしたものがあるわけないし、 あったとしてもその程度自分で書いたほうがいい。 : 751 [] 2015/01/19(月) 22:53:12.14 :brayh5c/ あ、もう自己解決したので結構です 752のようなゴミスクリプトとは違って 機能も満たしていてとても使い勝手の良いものを見つけたので。 : Name_Not_Found [sage] 2015/01/19(月) 22:55:41.85 ID:??? で、今度は、それつかって○○ができないんです。 どうしたらいいですか?って書き込むんだろう?w 「魚を一匹やれば1日食いつなぐが、魚の取り方を教えてやれば一生食いはぐれることはない」 ということわざ通りだな。 : Name_Not_Found [] 2015/01/19(月) 23:07:33.18 :brayh5c/ いいえ、もう実装も済んで完了しましたが? 役に立たない低脳はもうレスしないでくださいね^^ : Name_Not_Found [sage] 2015/01/19(月) 23:10:12.52 ID:??? 残念。レスしたよ?w お前の望みは果たされず。 : Name_Not_Found [] 2015/01/19(月) 23:22:12.49 :brayh5c/ あー、言葉が通じない残念なガイジか在日かな? ゴミスクリプトしか書けないのも納得ワラ : Name_Not_Found [sage] 2015/01/20(火) 01:50:15.16 ID:??? 技術者のくせにネトウヨかよ なんというゴミ : Name_Not_Found [sage] 2015/01/20(火) 02:34:39.56 ID:??? var myView = Backbone.View.extend() みたいなコードを見かけたのですが、 myViewはクラスなのだから、頭文字大文字のMyViewの方が適当ではないでしょうか? : Name_Not_Found [sage] 2015/01/20(火) 04:01:57.37 ID:??? delegateEventsとundelegateEventsの独特な挙動 ttps://github.com/honmaaax/Haraochi.js/blob/master/texts/Backbone.js/delegateEvents%E3%81%A8undelegateEvents%E3%81%AE%E7%8B%AC%E7%89%B9%E3%81%AA%E6%8C%99%E5%8B%95.md backboneのこんな記事を見つけました この挙動は実にイケてないと思います なんでこんな挙動なんですか? : Name_Not_Found [sage] 2015/01/20(火) 05:57:41.28 ID:??? このクソダサ仕様はmarionette.jsでは解決してるんでしょうか? : Name_Not_Found [sage] 2015/01/20(火) 06:21:28.71 ID:??? ダサいかどうかは使う人の技術力よ。 技術力が低いと、理由もわからずダサいと思ってしまうものだよ。 : Name_Not_Found [sage] 2015/01/20(火) 06:25:09.11 ID:??? は?理解して言ってるか? これはダサい以外の何ものでもねーぞ : Name_Not_Found [sage] 2015/01/20(火) 06:27:52.59 ID:??? delegateEventsという設定用プロパティを用意して デレゲート出来るようにするのが筋だと思います 何故そうしてないのでしょうか?アホなのでしょうか? : (*´∀`)エラーメッセージがあれば親切 [] 2015/01/20(火) 14:19:16.57 :ctPQmwKJ ttps://twitter.com/kai_ri_no/status/557402636253544448 こんな風に head要素の下に script要素を追加して通信してるのだけど、 サーバーの応答は、どうすれば見えるの? head.insertBefore( script, head.firstChild ); : Name_Not_Found [sage] 2015/01/20(火) 18:59:17.55 ID:??? jQueryとjQuery UIのtabsを使って、Googlemapsを表示させてます。 地図がグレイになる問題は、resizeをかけることで解消したのですが、中心位置が自分が意図してたところから大きくズレています。 (東南に数十km離れたところが中心になって表示される) あとコントロールも一切表示されていません。 jQuery UIのライブラリロードをコメントアウトすると正常に地図は表示されます。 jQueryUIとGooglemapsは相性が悪いのでしょうか? GMAP3とかも使ってみましたが同様でした。 FFのFirebugで見ると、jQueryでエラーが出ています。「TypeError: this.each is not a function」 何か関係あるのでしょうか?同様にjQuery UIを外すとエラーは出ません。 よろしくお願いいたします。 : Name_Not_Found [sage] 2015/01/21(水) 11:35:40.35 ID:??? この宣伝スレ立てたのお前? いい加減にしろよ シェアウェアが売れたら報告するよ [転載禁止](c)2ch.net ttp://peace.2ch.net/test/read.cgi/hp/1419667268/ : Name_Not_Found [sage] 2015/01/22(木) 04:11:17.35 ID:??? 中心位置が南東方向にズレるのは、日本測地系で読み取った経緯度を世界測地系に そのまま放り込んだからだと思うけど、ずれるといっても400〜450mくらいだしなあ… : Name_Not_Found [age] 2015/01/22(木) 20:55:37.94 ID:??? lodash 3.0 リリース間近! ttps://github.com/lodash/lodash 3.0-preから-preが外れました! スレが多すぎてどこに書けばいいかわからないので 関連スレすべてにマルチポストしています。m(__)m : (*´∀`)エラーメッセージがあれば親切 [] 2015/01/23(金) 11:32:22.85 :dpv5PxKS ttps://twitter.com/kai_ri_no/status/558449951332519936/photo/1 通信はajaxなんだけど、 HTTP応答のイベントがあったら呼び出される関数は、ここに追加するの? : Name_Not_Found [sage] 2015/01/24(土) 21:24:32.79 ID:??? fquery の fullCalendar で、予定表を作成しているのですが、 events: [ { id:1, title: 'イベント1-1', start: '2015-01-23T16:00:00', end: '2015-01-23T17:00:00' }, { id:1, title: 'イベント1-1', start: '2015-01-24T16:00:00', end: '2015-01-24T17:00:00' }, { id:2, title: 'イベント2-1', start: '2015-01-23T16:00:00', end: '2015-01-23T17:00:00' }, { id:2, title: 'イベント2-1', start: '2015-01-24T16:00:00', end: '2015-01-24T17:00:00' }, ] のようなイベントを作成して、 id 別に 表示のON OFF を切り替えることは出来ますか? 例:id:1 のイベントを表示し、id:2のイベントは隠す : Name_Not_Found [age] 2015/01/25(日) 06:12:39.80 ID:??? 知らないけど、自分でそうできるように 作ればいいんじゃないですか? : Name_Not_Found [age] 2015/01/27(火) 00:54:46.05 ID:??? lodash 3.0 キタ━━━━(゚∀゚)━━━━!! : Name_Not_Found [] 2015/02/06(金) 23:21:51.11 :LaRPcrT2 venobox分かる方いらっしゃいますでしょうか Lightboxみたいなものなのですが アイフレームで読み込んだHTML側に閉じるボタンを付けたいのですが 方法が分かりません : Name_Not_Found [sage] 2015/02/06(金) 23:46:35.48 ID:??? 画像をLightbox2で表示させてるのですが、aの要素にいちいちライトボックスに 渡すためのタグを追加するのがめんどくさくなってしまいました。 Divで囲んだ範囲内にある画像をまとめてLightboxに渡すことは可能なのでしょうか? その場合はどのように記述してあげればできますか? よろしくお願いします。 : Name_Not_Found [sage] 2015/02/10(火) 23:39:23.33 ID:??? underscoreもlodashも_という記号自体に名称が由来してるって今気付いた : Name_Not_Found [age] 2015/02/11(水) 01:22:52.10 ID:??? underscoreはまんまなんで知っていたが lodashは、low dash だったのか。言われて気づいた。 だからLo-dashって書いていたのね。(今はlodashに改名したっぽいが) : Name_Not_Found [sage] 2015/02/11(水) 05:31:07.73 ID:??? perlとrubyとの関係みたいなもんか : Name_Not_Found [sage] 2015/02/11(水) 09:51:58.52 ID:??? あ、rubyってそういうことなんだ 気取った名前だなぁと思っていたが : Name_Not_Found [sage] 2015/02/11(水) 10:43:53.70 ID:??? lodash 3.0 キタ━━━━(゚∀゚)━━━━!! の続報が出ていないが、 バグ修正版の3.0.1、3.0.2が来たあと 関数が追加された3.1.0が来たね。 最近のコミット見るとまた関数が追加されたみたいだし。 もうすぐ3.2もくるかな。 また以前のように早いリリースに戻ったようで嬉しい。 : Name_Not_Found [sage] 2015/02/15(日) 21:42:10.64 ID:??? どなたかお願いします。 ■ 目的 チェックボックスのon/offと連動して 別要素divの色をチェックon=青、チェックoff=赤と変えたい。 ■ 記述 ----- HTML ---- <input id="chk1" type="checkbox"> <div id="box1"></div> ----- CSS ----- #box1 {background-color: blue;} .toRed {background-color: red;} ----- jQuery ----- $('#chk1').click(function(){ $('#box1').toggleClass('toRed'); }); ■ 実際 一応目的通り動作しますが、IE9でチェックボックスをWチェックすると チェックと青赤表示が互い違いになってしまいます。 つまりチェックされてるのに青、またはその逆に。 Foxは問題なく動作します。そこで $('#chk1').dblclick(function(){return false;}); としてみたのですが変わらずです。 IE対策か根本的間違いなのかご指摘などお願いします。 : Name_Not_Found [sage] 2015/02/16(月) 00:28:10.31 ID:??? > チェックボックスのon/offと連動 ・・・なんだから、 > $('#box1').toggleClass('toRed'); トグルじゃなくて「連動」させたら? : Name_Not_Found [sage] 2015/02/16(月) 08:40:40.51 ID:??? 疑似クラスcheckedを使うべき jQueryを併用するならckecked未実装向け(IE8-)に適用すべき ttp://www.hcn.zaq.ne.jp/___/WEB/selectors4-ja.html#checked : Name_Not_Found [sage] 2015/02/16(月) 10:15:56.51 ID:??? 最近、「まだjQuery使ってるの?」的な意識高い人達の意見があるけど、代わりに何使ってんのかな : Name_Not_Found [sage] 2015/02/16(月) 11:01:39.57 ID:??? reactはview専用ライブラリですが、 それならmodelが必要ですよね? model専用ライブラリみたいのあるんでしょうか? : Name_Not_Found [sage] 2015/02/16(月) 20:31:39.52 ID:??? レスありがとう。 疑似クラスcheckedでもIEの件は同じです。 : Name_Not_Found [sage] 2015/02/16(月) 20:35:09.65 ID:??? if文で状態をチェックしてaddClass、removeClassするしかないんでね? : Name_Not_Found [sage] 2015/02/16(月) 20:51:51.47 ID:??? > 疑似クラスcheckedでもIEの件は同じです。 :checked は IE9 でサポートされているはずだが、本当に効かないのか? ttp://jsfiddle.net/heot7au7/ : 788 [sage] 2015/02/16(月) 21:22:26.84 ID:??? > 別要素divの色をチェックon=青、チェックoff=赤と変えたい。 挙動が逆か ttp://jsfiddle.net/heot7au7/1/ これはCSS定義がおかしいだろ デフォルト赤を期待しているのになぜCSSでは青をデフォルトにしてるんだ : Name_Not_Found [sage] 2015/02/16(月) 22:20:48.69 ID:??? 一番妥当で一番確実なのがそれですね。 781は簡略化してますが実際は複数あり、関数化するにもやや複雑になり チェックボックス+トグルだけで済ませればかなり簡素化できて楽でして。 やはり急がば回れですかね。ありがとうございます。 問題は「戻る」でして・・・ ちなみにFoxとChoromeでは問題の互い違いの症状は全く出ません。 それどころか戻ったときにチェックもdivもページ移動前の状態を維持してくれています。 さすがにIE9捨てるわけには・・・ すみません、文章が逆でした。チェックon=赤、チェックoff=青でした。 実際はそうではなく違うことを実行してるのですが わかりやすく書き換えたときに間違えてしまいました。 : 788 [sage] 2015/02/16(月) 22:28:33.39 ID:??? ではで問題をクリアしているのではないのか? : 788 [sage] 2015/02/16(月) 22:45:53.17 ID:??? そもそも、[戻る] でどんな動作を期待しているのかがわからん まだ出していない「新しい要件」があるなら具体的にいってもらわんと 時点ではそんな要件はなかった 情報を後出しするなら初めからまとめて出すべき : Name_Not_Found [sage] 2015/02/16(月) 23:11:18.59 ID:??? 動作期待は通常のユーザの操作で互い違いにならないこと つまりチェックの状態とjQメソッドの状態が同一になることです。 IEでチェックした状態でページ移動して戻ると互い違いになります。 戻るでなくてもWチェックの件もクリアしてませんが。 IE9で実際にやってますか? 今さっきそれで書き直したらIE9で正常にできました。 ckeckedを取得してその状態でaddClassかremoveClassに分けるそのまんまです。 $('#chk1').dblclick(function(){return false;});の行も削除してできました。 ありがとうございました。 : Name_Not_Found [sage] 2015/02/17(火) 00:09:54.76 ID:??? #box1 { background-color: blue; } #chk1:checked ~ #box1 { background-color: red; } IE9でチェックしたがダブルクリックしてもブラウザで戻っても問題なかったぞ? : Name_Not_Found [sage] 2015/02/17(火) 20:11:28.04 ID:??? background-color: red; を別の何かスクリプトでしかできないことに置き換えてごらん : Name_Not_Found [sage] 2015/02/17(火) 21:32:18.03 ID:??? ~なしでお願いします。 : Name_Not_Found [sage] 2015/02/17(火) 21:57:37.23 ID:??? の + で 条件の後出しが本当に多いな : Name_Not_Found [sage] 2015/02/17(火) 23:22:26.50 ID:??? 「CSS で実装すべき機能を JavaScript に置き換える理由があるのか」を考えてから発言すべき : Name_Not_Found [sage] 2015/02/18(水) 00:16:27.25 ID:??? 後出しじゃなくてお前が勝手に~の条件付け足してるだけだろ お前バカか? CSS で実装すべき機能と何で決め付けてんだよ : Name_Not_Found [sage] 2015/02/18(水) 00:18:26.85 ID:??? できないならできないと言えよ : Name_Not_Found [sage] 2015/02/18(水) 00:21:14.90 ID:??? >情報を後出しするなら初めからまとめて出すべき そうするとどうせ削れとか言うだろ 本当に面倒なやつだな シミュでできたからって記述そのまま全てではないだろ そのくらい察しろよ : Name_Not_Found [sage] 2015/02/18(水) 00:24:55.66 ID:??? 「スクリプトをCSSでやる理由があるのか」を考えてから発言すべき : Name_Not_Found [sage] 2015/02/18(水) 00:54:01.88 ID:??? 【サンプルコード】現象を再現可能な最小限のコードを書いてください。 初心者(?)なら余分に削ったりしてしまうことは十分ありえる 当然他の処理してることも十分ありえる というかjQuery使ってる時点でそれは予想できる >781は簡略化してますが実際は複数あり、関数化するにもやや複雑になり : Name_Not_Found [sage] 2015/02/18(水) 00:58:43.87 ID:??? 普通ピンとくるよな : Name_Not_Found [sage] 2015/02/18(水) 01:04:19.93 ID:??? CSSで実装できる機能をJavaScriptで車輪の再発明する意味があるのか? : Name_Not_Found [sage] 2015/02/18(水) 01:05:16.98 ID:??? 前提条件の後出しの話を言ってるのにコードの後出しとかわけわからんことを言われてもねえ : Name_Not_Found [sage] 2015/02/18(水) 01:07:11.23 ID:??? 見た目に関わることはCSSの役割 : Name_Not_Found [sage] 2015/02/18(水) 08:33:05.86 ID:??? いつの時代の戯言言ってんの? : Name_Not_Found [sage] 2015/02/18(水) 09:40:10.46 ID:??? そうとも限らない checkboxに直接関係したlabelなどならいいが別の要素ならscriptも有り得る あくまでSSはスタイル、動的状態変更はscriptに分担が基本 でないと全体見てここだけSSで変更、他はscriptで変更となってしまう E:checkedやE:hover、つまりそのもののスタイル変更くらいに とどめておかないと大変なことになる 後に別の条件が加わるかもしれんし : Name_Not_Found [sage] 2015/02/18(水) 10:15:17.47 ID:??? アニメーション作るとCSSは変数扱えないしお荷物だなって思う : Name_Not_Found [sage] 2015/02/18(水) 11:10:10.28 ID:??? ~は記述が狭められるし、今回簡略化や別処理は明確なのだからそれで後出しと言うには無理がある (俺なら勧めないし、勧めてもこういう手もある、だめだったのならああそうかで済ますだけ) で、 dblclickのイベントは、click, click, dblclick 別のイベントが発火・作用してしまっている可能性がある とはいえIEだけというのはそこに原因がある気がする (そもそも問題提起の本質はそこなんだけどな) : Name_Not_Found [sage] 2015/02/18(水) 14:11:44.12 ID:??? 勿論、JavaScriptの方がいい場合はあるが、はJavaScriptに拘る理由が感じられない 見た目と挙動が一致しないのは CSS だけで実装すれば原理的に問題が発生しない やるとすれば、checked疑似クラス未対応ブラウザを機能テストしてJavaScriptで実装するぐらい その場合もtoggleなとは使わずにchecked判定して適用するclassを決定する また、changeだけでなく、DOMContentLoaded 時にもclassを適用する これで100% check状態と見た目が一致する : Name_Not_Found [sage] 2015/02/18(水) 20:42:44.36 ID:??? CSSでできるからって何でもかんでもCSSでやればいいってもんじゃない あれが全部ではない、トグルのほうが楽だと思ったと書いてあると何度言ったら それはで解決してるんだからもういいんじゃね : Name_Not_Found [sage] 2015/02/18(水) 21:26:40.58 ID:??? 何でもCSSでやれとはいわない 何百行もCSSを書いてアニメーションするようなテクニックはネタであって実用的ではない だが、たった1行のCSSで解決する問題をJavaScriptで解決するのは冗長なだけで何もメリットがない : Name_Not_Found [sage] 2015/02/18(水) 22:13:24.19 ID:??? >たった1行のCSSで解決する問題 >何もメリットがない ・・・。 最初から読んでね。それと、 もうどうでもいい。 : Name_Not_Found [sage] 2015/02/19(木) 00:33:17.21 ID:??? 質問者は<!DOCTYPE html>から全文書くように でないと「HTML5とか後出しするなよ」と突っ込まれます : Name_Not_Found [sage] 2015/02/19(木) 04:28:58.40 ID:??? の質問に対してCSSのみで実装するよう指摘したアドバイスは的確でしょ ソースの簡略化しすぎや言葉足らずは質問者によくあることだからすぐ訂正すればよかったものを 面倒くさくなって誤魔化したり煽ったりするから真面目に答えようとしてる相手には余計にややこしくなるんだよ : Name_Not_Found [sage] 2015/02/19(木) 19:29:56.36 ID:??? 疑似クラスのような状態を表すセレクタもCSSで書けるから簡単な処理ならJavaScriptは要らなくなるよな :hover は mouseover, mouseout で代替 :active は focus で代替 出来るけど、CSSでやった方が明らかに管理が楽 :visited に至っては JavaScript で代替できそうにない : Name_Not_Found [sage] 2015/02/19(木) 20:44:16.57 ID:??? たった1行だからこそ見落としやすく、例外があると後々に、または他人が見て大変 業者にたった1行だからなんて言えないよね それくらいならいいでしょ、というより普通でしょ : Name_Not_Found [sage] 2015/02/19(木) 22:15:01.57 ID:??? アホか 切り分け対象総数が少なくなる上にプロパティの組み合わせを考える必要がなくなるのに見落としやすいわけないだろ おまえはどうやってデバッグするつもりなんだ? : Name_Not_Found [sage] 2015/02/19(木) 22:25:14.65 ID:??? そもそも、CSSとJavaScriptではCSSの方が圧倒的にデバッグしやすいはずなんだけどね CSSの1行とJavaScriptの複数行なら更に差が広がる : Name_Not_Found [sage] 2015/02/19(木) 22:54:06.18 ID:??? 議論の前提が食い違ってるだけで 実は両者の意見に大差ないというよくあるやつだろコレ : Name_Not_Found [sage] 2015/02/19(木) 23:37:20.28 ID:??? デバッグしやすい云々もだが一貫してるかどうかも重要 : Name_Not_Found [sage] 2015/02/19(木) 23:38:42.85 ID:??? そもそも1行で済むと勝手に前提してるけど実際は違うんだよな : Name_Not_Found [sage] 2015/02/19(木) 23:40:23.15 ID:??? ああ、後出しとか言うからやめとくか : Name_Not_Found [sage] 2015/02/19(木) 23:47:14.27 ID:??? CSS否定派がどんどん墓穴を掘ってる感じ : Name_Not_Found [sage] 2015/02/20(金) 00:01:58.52 ID:??? が一般的だな 一貫性があってデバグもやりやすい 伝達や継承もしやすい : Name_Not_Found [sage] 2015/02/20(金) 00:01:59.35 ID:??? つかCSS1行で解決できなかったの? それならのサンプルコードと説明の仕方が悪いんじゃん喧嘩すんなよ : Name_Not_Found [sage] 2015/02/20(金) 00:07:29.37 ID:??? 1行か知らんが、の質問に対してCSSの:checkedを回答するのはまともな回答 後付でいろいろ条件を出すから変にこじれるんだよな : Name_Not_Found [sage] 2015/02/20(金) 00:10:29.04 ID:??? かといって~はない : Name_Not_Found [sage] 2015/02/20(金) 00:13:25.27 ID:??? 誤:【サンプルコード】現象を再現可能な最小限のコードを書いてください。 正:【サンプルコード】HTML,SS,JSのコード全文を書いてください。 : Name_Not_Found [sage] 2015/02/20(金) 00:23:08.11 ID:??? 余計なコードまで全部読まされるのは勘弁 : Name_Not_Found [sage] 2015/02/20(金) 19:46:27.42 ID:??? 元の記述だけならE:checkedは自然だがそこまでこだわって言い続けなくても このスレからしてScriptの記述があるのも考えられるし実際最初にそう書いてるし 当然記述を省略してるだろうし実際どこを削ってどこを残すかの判断は人によっては簡単でもない >後付でいろいろ条件 だけだし(青赤逆だったのはあるがのは後出しではない) そんな無茶な注文でもなかろう どっちかと言うとこじれてるのは後出し後出しと繰り返していることに見える しかも質問者はもう済んでるのに : Name_Not_Found [sage] 2015/02/21(土) 11:33:12.67 ID:??? 質問者は終わってるが、外野がいちいちCSSがおかしいと文句つけるから回答した人が反論し続けるのだろう この場合はCSSだけでいいのだからそれで終われば良かったものを : Name_Not_Found [sage] 2015/02/21(土) 13:07:58.13 ID:??? >CSSだけでいい そこかよw : Name_Not_Found [sage] 2015/02/21(土) 15:55:27.77 ID:??? やはりここは全員一致で 恥ずかしい顔文字コメントも含めて : Name_Not_Found [sage] 2015/02/21(土) 17:43:36.55 ID:??? 全員一致…? : Name_Not_Found [sage] 2015/02/21(土) 20:47:02.64 ID:??? 一人で意見統制しようと頑張ってる人がいるから、あまり関わりたくないなあと思ってる 総意をコントロールしたい感が透けて見える : Name_Not_Found [sage] 2015/02/21(土) 21:22:42.11 ID:??? ジョークもわからんのか : Name_Not_Found [sage] 2015/02/21(土) 21:55:19.35 ID:??? 質問者がだめだった言ってるのにしつこくゴリ押ししてるのがキモイ : Name_Not_Found [] 2015/02/26(木) 12:40:02.66 :sloVcVUM こんにちは、質問です。 日本地図のエリア情報を表示できるライブラリを探しているのですが、ご存知の方はいらっしゃいますか? 具体的には、最初は日本地図で各エリア(関東、近畿、四国など)をクリックすると そのエリアの各都道府県が表示されるようなものです。 イメージとしてはこのサイトのようなものです ttp://www.flashwork-s.com/map/map2/index.html この参考サイトはFlashで作られているのですが、 JavaScriptでこれと似たようなことを出来るものはないでしょうか? JapanMapというものは見つけましたが、これはエリアからその都道府県の表示が出来ませんでしたので、他のがあれば教えてくださいm(_ _)m : Name_Not_Found [sage] 2015/02/26(木) 13:01:47.57 ID:??? そういうものがライブラリになってるわけがない。 自分で作るんだよ。 : Name_Not_Found [] 2015/02/26(木) 13:28:48.04 :sloVcVUM 用途やニーズは実際にあり、Flash版やJapanMap等既にありますので、 他にもあっておかしくないと思い、質問させて頂いてます。 もちろん、無ければ最終的には自分が作ることを考えおりますが、 自分が作りたいと思ったものは既に利用できる形で公開されている場合も多いので、 ご存知の方がいらっしゃれば教えてください。 : Name_Not_Found [sage] 2015/02/26(木) 13:41:10.98 ID:??? おそらく無いだろうね。まあCanvasやSVGの汎用的なライブラリはあるから それらを使って足りない機能を自分で作る事になるんじゃないか? : Name_Not_Found [sage] 2015/02/26(木) 17:09:51.10 ID:??? Google Maps API : Name_Not_Found [sage] 2015/02/26(木) 17:51:47.87 ID:??? DOMでできることは jqueryでもできるってことで間違いないの? : Name_Not_Found [sage] 2015/02/26(木) 18:19:27.10 ID:??? そりゃそうだろ : Name_Not_Found [sage] 2015/02/26(木) 18:25:27.55 ID:??? それは語弊がないか? jQueryはDOMの全てをカバーしてるわけじゃない 例えばテキストノード操作に関してはかなり貧弱 : Name_Not_Found [sage] 2015/02/26(木) 19:20:15.56 ID:??? テキストノードの操作って何が必要なんだ? : Name_Not_Found [sage] 2015/02/26(木) 23:23:39.97 ID:??? jQueryにはtextContentしかないからなあ : Name_Not_Found [sage] 2015/02/26(木) 23:30:39.39 ID:??? だから他に何が必要なんだ? DOMにある機能で。 : Name_Not_Found [sage] 2015/02/26(木) 23:36:11.16 ID:??? dataプロパティとか、テキストノードをreplaceChildとか : Name_Not_Found [sage] 2015/02/26(木) 23:37:09.18 ID:??? そもそも、jQueryではテキストノードを選択できないな : Name_Not_Found [sage] 2015/02/27(金) 11:34:29.65 ID:??? テキストノードは、idもclassも付けられないんだから 選択しようがないと思うが。 DOMでも選択はできないよね? DOMでできることはchildNodesで列挙して行くことなわけで、 それと同じことならjQueryではcontents()で可能 DOMで選択はできないが、childNodesで列挙することはできる。 それをjQueryではcontents()で出来る。 だから「DOMでできることはjQueryでもできる」は間違いじゃないよ。 : Name_Not_Found [sage] 2015/02/27(金) 12:07:04.21 ID:??? jQueryが便利すぎて別言語に思うこともあるけど、ただのライブラリなんだよな : Name_Not_Found [sage] 2015/02/27(金) 12:58:57.21 ID:??? > DOMでも選択はできないよね? DOM ならテキストノードを参照できる XPath の text() を使ってもいいし、要素ノードから firstChild や childNodes を辿ってもいい : Name_Not_Found [sage] 2015/02/27(金) 13:13:52.19 ID:??? > それをjQueryではcontents()で出来る。 で、をどうやって実現する? : Name_Not_Found [sage] 2015/02/27(金) 13:29:18.50 ID:??? 例えば、こういうコードは jQuery だけでは書けない ttp://jsfiddle.net/eh65ytw3/ Text#data や TEXT_NODE の replaceChild に成り代わるものが jQuery API には存在しない : Name_Not_Found [sage] 2015/02/27(金) 13:44:45.93 ID:??? jQuery を使うならこうかな ttp://jsfiddle.net/eh65ytw3/1/ DOM API を使わないと書けそうにないね : Name_Not_Found [sage] 2015/02/27(金) 14:04:39.48 ID:??? jQuery の場合、要素ノード操作に特化しすぎてる感があるな Node#firstChild, Node#lastChild, Node#nextSibling, Node#preventSibling 等の足りないAPIが多すぎる : Name_Not_Found [sage] 2015/02/27(金) 14:23:23.82 ID:??? まあDOM APIを使ったとしてもテキストノードは扱いづらいからな <span>で囲めばいいだけの話だし、jQueryがテキストノード操作を捨てるのは妥当だと思うよ 「DOMでできることは jqueryでもできる」とは言えないだろうが、それは当たり前。 よく使う操作を楽にするのがライブラリの本領だから。 : Name_Not_Found [sage] 2015/02/27(金) 16:29:47.02 ID:??? 昔(1.2より前)はxpathのセレクタもサポートしていたみたいだけどね でもテキストノードを選択出来たとしても、jQueryのメソッドが 要素と同じように適用できるとは思えないけれど : Name_Not_Found [sage] 2015/02/27(金) 16:49:40.68 ID:??? 結局、jQueryではテキストノード操作は出来ないのか テキストノードが選択できないといったり、テキストノード操作が出来るといったり、彼の主張は前言撤回が多すぎて説得力ゼロだな : Name_Not_Found [sage] 2015/02/27(金) 16:55:59.78 ID:??? > でもテキストノードを選択出来たとしても、jQueryのメソッドが > 要素と同じように適用できるとは思えないけれど 当たり前じゃね? テキストノードっていうのは 要素じゃないんだから、それはそもそもDOMの問題だ。 : Name_Not_Found [sage] 2015/02/27(金) 16:57:23.82 ID:??? DOM要素単位で扱うものなんだから ノード操作が出来ないのは当たり前だろ : Name_Not_Found [sage] 2015/02/27(金) 17:12:22.15 ID:??? .text() で値は取れるな (.nodeValue が返される模様) セットはできないけど : Name_Not_Found [sage] 2015/02/27(金) 17:15:11.81 ID:??? text() は引数を与えればセットも出来るが、これはtextContentであってテキストノードを参照しているわけではない ttp://api.jquery.com/text/ : Name_Not_Found [sage] 2015/02/27(金) 17:17:53.75 ID:??? JavaScriptでマシン語が使えないの?って言ってるようなものだろ : Name_Not_Found [sage] 2015/02/27(金) 17:25:48.33 ID:??? jQueryのソース見ると、こんな感じでnodeTypeみて処理しているから、 何かしらの意味があってやってるんじゃないかな。 text: function( value ) { return access( this, function( value ) { return value === undefined ? jQuery.text( this ) : this.empty().each(function() { if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) { this.textContent = value; } }); }, null, value, arguments.length ); }, : Name_Not_Found [sage] 2015/02/27(金) 17:29:20.41 ID:??? プリコンパイルされたライブラリとか欲しいね まあプラグイン経由とかだったり署名付けたりとか色々と面倒そうだけど : Name_Not_Found [sage] 2015/02/27(金) 17:29:42.81 ID:??? DOM APIを使った事がなくてjQueryで何が出来るか知らない人が何でも出来るとほらを吹いただけか : Name_Not_Found [sage] 2015/02/27(金) 17:31:12.64 ID:??? お前jQueryに親でも殺されたの? : Name_Not_Found [sage] 2015/02/27(金) 17:35:55.16 ID:??? それの jQUery.text(this) の所が取得側なんだけど jQuery.text = Sizzle.getText; ってなってて Sizzle.getText;では } else if ( nodeType === 3 || nodeType === 4 ) { return elem.nodeValue; } こういう部分があるね これでテキストノードでも値が取れる : Name_Not_Found [sage] 2015/02/27(金) 17:39:04.14 ID:??? JavaScriptスレでも暴れていたし、jQuery信者をうざいと思ってる人は相当数いるんじゃない? : Name_Not_Found [sage] 2015/02/27(金) 17:44:32.42 ID:??? それはSizzleだから対応しているって感じでいいのかな? Sizzleだと取得しか必要ない気がするし。 SizzleのCSS4対応ってどうなるんだろうか。 一応するみたいだが、そもそもCSS4がまだ使用が固まってないんだっけ? ttps://github.com/jquery/sizzle/issues/237 CSS4でもテキストノードを選択する方法はないのかな? : Name_Not_Found [sage] 2015/02/27(金) 17:45:07.63 ID:??? 俺の知る限り、一人が過剰に拒否しているだけに見えるね。 : Name_Not_Found [sage] 2015/02/27(金) 17:48:04.33 ID:??? CSS: Selecting text nodes (as with XPath’s text()) ttp://www.opinionatedprogrammer.com/2011/01/css-selecting-text-nodes-as-with-xpath-text/ > There used to be a :contains() pseudo-class for this in a CSS 3 draft, but it’s gone. ほー、どうやらCSS3の仕様として:contentsというのがあったらしい。 けど無くなったと。だれか経緯しらない? : 877 [sage] 2015/02/27(金) 17:51:27.26 ID:??? あ、なんか勘違いか。 : Name_Not_Found [sage] 2015/02/27(金) 18:04:27.31 ID:??? 反応するかは別として回答の質を落としてるのは間違いないな : Name_Not_Found [sage] 2015/02/27(金) 18:06:19.46 ID:??? それはjQueryを使わない回答をする奴がいないのが悪いんだろう? : Name_Not_Found [sage] 2015/02/27(金) 19:58:48.79 ID:??? jQueryを使った回答でもあるだけありがたいよ。 簡潔に書いた動く擬似コードだと思って それをDOM APIに置き換えればいいだけの話だし。 一番うざいのが、jQuery信者がーとかいいだすやつ。 いつもあいつをきっかけに荒れる。 : Name_Not_Found [sage] 2015/02/27(金) 22:20:21.74 ID:??? のようなjQuery方面だけに知識が偏っていて間違った回答なら無いほうがマシです 質問しても変な方向に切り返してきていちいち訂正するのが面倒くさいです 無視したら誠実さを疑われるのでスルーするわけにもいかないですし それから、jQuery以外の回答もjQuery信者がスレに張り付いているのでjQueryの回答だけ目立って見えるだけで普通にあります たくさんの間違った知識で答えるjQueryの回答よりも確かな知識で回答してくれる一人の回答の方が何倍も価値があります : Name_Not_Found [sage] 2015/02/27(金) 23:24:35.38 ID:??? つまり、間違った回答じゃなければOKだよね? 逆に間違った回答なら、DOMでもNGだよね。 : Name_Not_Found [sage] 2015/02/28(土) 00:22:33.36 ID:??? シンプルな質問 googoleメールや twitterくらいあんとみたいな 動的なサイトなら jqueryでバリバリ作れるってことだよね? : Name_Not_Found [sage] 2015/02/28(土) 01:00:11.15 ID:??? はい : Name_Not_Found [sage] 2015/02/28(土) 03:27:42.69 ID:??? ttp://netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css bootstrapのこのファイルが読み込み状態になったままで止まります もっといいCDNありますか? : Name_Not_Found [sage] 2015/02/28(土) 12:36:30.85 ID:??? 一時的なものでした : Name_Not_Found [] 2015/03/07(土) 19:19:09.53 :gZ1CpGNy document.getElementById("content").firstChild これをjQueryのAPIを使った場合はどう書くんでしょうか? $("content").children().first() これだと#content以下の子要素を全部取得してから最初の子要素を返すので何か違う気がしました : Name_Not_Found [sage] 2015/03/07(土) 19:25:32.60 ID:??? document.getElementById("content").firstChild $('#content :first-child') : Name_Not_Found [] 2015/03/07(土) 19:36:46.46 :gZ1CpGNy 高速化のためにobj = $("#content")みたいにして使いたいんですけど セレクターに指定するしか方法ないですよね : Name_Not_Found [sage] 2015/03/07(土) 19:40:38.12 ID:??? そんなことやっても、 一回あたり0.1ミリ秒未満しか高速化出来ないけど、 その処理何回実行されるの? : Name_Not_Found [sage] 2015/03/07(土) 20:07:43.20 ID:??? セレクターの内部の仕組みについて ttp://qiita.com/setzz/items/25064020f199e35d65db セレクターでIDを使った場合に動くgetElementByIdのパフォーマンス ttp://attosoft.info/blog/getelementbyid-performance/ IDを使ってるなら、毎回セレクターで取得しても問題ないかな、 古いバージョンのIEだとキャッシュを持つのは有効だと思う : Name_Not_Found [] 2015/03/07(土) 20:12:53.72 :gZ1CpGNy IE9以上で動けばいいのでセレクターで取得するようにします : Name_Not_Found [sage] 2015/03/07(土) 20:14:58.26 ID:??? 質問を無視しないでください。 : Name_Not_Found [sage] 2015/03/07(土) 23:16:45.81 ID:??? 知らんがな : Name_Not_Found [sage] 2015/03/08(日) 18:16:56.22 ID:??? 変数に入れておけば後でid変わった時に 一箇所変えるだけでよくなるというメリットがないこともないなと思ってる : Name_Not_Found [sage] 2015/03/09(月) 12:00:18.23 ID:??? jqueryっていつのまにか勝手にCSSのベンダープリフィックスをつけるようになったんですか? : Name_Not_Found [sage] 2015/03/09(月) 19:24:19.32 ID:??? jqueryで$("ul", "li") みたいにセレクターを2つの引数にわけて書く方法を見たんですがこれはjqueryのどのページで説明されてますか? : Name_Not_Found [sage] 2015/03/09(月) 19:33:27.01 ID:??? コンストラクタ ttp://api.jquery.com/jQuery/ : Name_Not_Found [sage] 2015/03/09(月) 22:07:36.78 ID:??? なるほど、書いてました $("ul", "li")じゃなくて$("li", "ul")ですね : Name_Not_Found [sage] 2015/03/09(月) 23:18:47.97 ID:??? 勘違いしているようだが、selectorを分けて書いてるわけではないから、そのコードは動かないぞ : Name_Not_Found [sage] 2015/03/09(月) 23:21:28.57 ID:??? え、 ttp://api.jquery.com/jQuery/#jQuery2 のことですよね 第二引数が親要素、第一引数がその子要素ってことじゃないんですか? : Name_Not_Found [sage] 2015/03/09(月) 23:22:02.65 ID:??? そういやそんな機能あったね。 調べてみたら1.8からみたい。 まあ、jQueryでCSSを書き換えるべきではない。 クラスを変えるべきって思っているから あんまり気にするところだとは思わないけど。 : Name_Not_Found [sage] 2015/03/09(月) 23:26:33.62 ID:??? これの使い方いまいちよくわからないんだよね。 $("ul").find("li")でできるじゃん? 短く書くことは出来る。でもそれぐらいしか違いがわからない。 速いのかと思えば、findの方が速いって記事もあるし。 一体何を想定して作られたんだろう? : Name_Not_Found [sage] 2015/03/09(月) 23:35:46.54 ID:??? htmlStringは<から始まってないとダメだから ttp://api.jquery.com/jQuery/#jQuery-selector-context こっちだね jQuery( selector [, context ] ) は内部的には jQuery(context).find(selector) と同じだから、 今はちゃんと動くけど context Type: Element or jQuery ってなってるから、あやしいと思うんだけどね : Name_Not_Found [sage] 2015/03/09(月) 23:37:35.98 ID:??? jQueryは同じ操作をするのに幾つか方法があるのが結構あるぞ : Name_Not_Found [sage] 2015/03/09(月) 23:54:30.69 ID:??? 他のは使い方が違ったり、readyとかは 「よく使うから短く」という考えで理解できるんだよ。 だけど、$("li", "ul") はそんな感じがしないんだよね。 引数が逆になってるのが気持ち悪いのかな? 第二引数で親要素を指定できる必要があったのだろうか?って考えてしまう。 もしかして本当はこうやって使うものだろうか? $('li', element); つまり第二引数はセレクタではなく親要素 これだと$(element)に比べて、jQueryオブジェクトを作らなくていい (内部的に作ってないのかどうかは知らない)から パフォーマンスが高い(かは調べてない)とか? : Name_Not_Found [sage] 2015/03/10(火) 00:18:08.08 ID:??? その事例なら第一引数はHTMLタグ文字列、第二引数はdocumentオブジェクトでselectorTextは出てこない 英文をちゃんと読んでる? : Name_Not_Found [sage] 2015/03/10(火) 00:21:47.98 ID:??? そちらの方が近いけど、第二引数はselectorTextではないし、が勘違いしているとしか思えない 一体、どの文面を読んでに至ったというのか : Name_Not_Found [sage] 2015/03/10(火) 00:25:21.40 ID:??? そうそうの正しい方には、contextって書いてあるんだよな。 jQueryでいうcontextってなんなんだろうか? って思ったら、addとかにもcontextあるのか? そして、deprecatedになっている.contextプロパティ。 もしかして古いjQueryの仕様なのかな? : Name_Not_Found [sage] 2015/03/10(火) 00:49:16.88 ID:??? > context > Type: Element or jQuery > A DOM Element, Document, or jQuery to use as context ちゃんと書いてあるだろ 原文読まずにいい加減に脳内補完するから迷うんだ : Name_Not_Found [sage] 2015/03/10(火) 00:57:00.21 ID:??? $("li", "ul")でも動くけど$("li", "<ul>")って違いなくない? 別に<>で囲まなくてもelementとして認識してるんじゃないの? : 910 [sage] 2015/03/10(火) 01:03:24.24 ID:??? 俺にいってるの? 誰に何をいいたいのかさっぱりわからないんだけど。 ちゃんと説明して。 : Name_Not_Found [sage] 2015/03/10(火) 01:04:54.81 ID:??? elementっていうのは、 document.getElementById("#id") で取得したもののことだよ。 : 911 [sage] 2015/03/10(火) 01:11:23.42 ID:??? にいってる セレクター文字列を渡す仕様なんてどこにも書かれてないだろ どこをどう読んだらそんな解釈になるんだ? 実際、動くことは動くが、jQuery仕様外の動作の上に子孫セレクタを使っているのと何も変わらん ttp://jsfiddle.net/uyojzsj6/ : 905 [sage] 2015/03/10(火) 01:34:10.98 ID:??? そう、つまり第2引数で Type: Element or jQuery であることのチェックをしてないだけだね リリースノートにもかかれずに変更される事もありえる (ドキュメントが実装に合わせて変わる可能性もあるけど) : Name_Not_Found [sage] 2015/03/10(火) 20:16:48.51 ID:??? $()の2番目の引数は、検索対象の文書を指定する時に使う。 $(selector, window.opener.document) →親ウインドウの文書から検索 : Name_Not_Found [sage] 2015/03/10(火) 21:03:08.75 ID:??? $(window.opener.document).find(selector) これでもいいけどね。 ここに書いてあるとおり、findで実装されているわけで。 ttp://api.jquery.com/jQuery/ > Internally, selector context is implemented with the .find() method, so $( "span", this ) is equivalent to $( this ).find( "span" ). : Name_Not_Found [sage] 2015/03/10(火) 21:30:45.94 ID:??? $(':first-child', parent) こうかけるから楽 parent.children().eq(0)はメモリの無駄遣い : Name_Not_Found [sage] 2015/03/10(火) 22:03:19.50 ID:??? 当然だが、 $(parent).find(':first-child') こうもかける そしてfindで実装しているということから 容易に推測可能だと思うがfindの方が速い : Name_Not_Found [] 2015/03/15(日) 22:26:12.87 :irw7IN5D 質問です。 iframe内に読み込んでいる外部ドメインのサイトで iframe内で遷移があった時にだけ、何かをする(例えば注意書きを表示する等)事は 可能でしょうか? 例えばjQueryの .on('load',function(){ ですと、最初の読み込み時と、ユーザーがiframe内で遷移した時の区別ができないので どうしてよいのかわかりません。 宜しくお願いいたします。 : Name_Not_Found [sage] 2015/03/15(日) 22:36:32.18 ID:??? 1度イベントが発生したら関数を登録しなおせばいいのでは? : 921 [sage] 2015/03/16(月) 01:55:23.48 ID:??? ありがとうございます。 下記の方法で解決しました。 @外部サイトをphpで取得、遷移発火部分のクリックイベントをキャッチしAを操作 A上記@をiframeで読み込む。クリックイベントによりiframeを非表示 : Name_Not_Found [] 2015/03/18(水) 22:28:28.86 :ia3/BcFS ttp://fyml.biz:3000 Geolocation API Sample 位置情報の取得に成功サイトを、Mailから開けるようにできるといいのですが。 できないようになっているのでしょうか。 : Name_Not_Found [sage] 2015/03/19(木) 13:10:08.70 ID:??? こんにちは! 【環境】IE8, Chrome 【ライブラリ】jQuery UI 【何をしたのか】 【期待する結果】 下記のようにHTML要素をボタンクリックで横に動かしたいのですが どのように書けばよいでしょうか? ボタン ボタン ↓ ↓ 【prev】 (テキスト)【next】 : Name_Not_Found [sage] 2015/03/19(木) 13:46:12.23 ID:??? ビッ○カメラ札幌店の副店長の佐藤伸弦が暴行事件が起きていた 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 佐藤伸弦 : Name_Not_Found [] 2015/03/24(火) 17:15:50.12 :nw+mY6V+ jquery $(selector).data('key', 'value'); console.log($(selector).data('key)); これでdatasetを操作できますが chromeのdevtoolsでdomを確認するとdata-key属性がありません 何故ですか? : Name_Not_Found [sage] 2015/03/24(火) 17:21:11.34 ID:??? datasetを操作しないからです : Name_Not_Found [sage] 2015/03/24(火) 18:56:14.02 ID:??? div#aの子要素の相対位置を取得したいんですが 先頭の要素なら0が欲しいんですが20が返って来ました どうやって取得できますか ttp://jsfiddle.net/p3sc6mL3/ : Name_Not_Found [sage] 2015/03/24(火) 21:52:40.30 ID:??? #a に position:relative を設定する。 あるいは単純に計算して差を取る : Name_Not_Found [sage] 2015/03/27(金) 14:41:03.93 ID:??? 初心者で申し訳ございません。 $("#id").animate({left: '-=100px'}); で クリックすると永遠横に動きます… クリックして動かせる範囲は指定出来ますでしょうか。 : Name_Not_Found [sage] 2015/03/27(金) 14:50:15.19 ID:??? HTML(属性含む)は初期値だと思え。 attrメソッドで意図的に属性を変えない限り、 変わるのは内部の値だけだ。 : Name_Not_Found [sage] 2015/03/27(金) 21:40:48.55 ID:??? 要望・バグとして中の人に報告してみれば? そもそも data-* 属性を読んでいるにもかかわらず、 が指摘しているような dataset のプロパティ set 時に起こるべき本来の副作用(属性作成や属性値変更)を伴わない。 これは明らかに手抜き実装によるバグだな。 なぜなら、jQuery の中の人にとって古めかしいと言われている IE8 ですら getter, setter はサポートされているので、簡単に polyfill 可能だから。 : Name_Not_Found [sage] 2015/03/27(金) 21:52:28.42 ID:??? > これは明らかに手抜き実装によるバグだな。 何いってんの? DOMでも一緒だよ。 何でもかんでもjQueryの問題にするな。 : Name_Not_Found [sage] 2015/03/27(金) 22:45:32.01 ID:??? にも書いてあるけどHTML(属性含む)は初期値を示す バグではなくドキュメントにも明記してあるから想像で書き込まずにまず確認しよう ttp://api.jquery.com/data/#data-html5 > The data- attributes are pulled in the first time the data property is accessed and then are no longer accessed or mutated ちなみにjQuery 1.4.2以前では、HTMLのdata-***属性は jQueryの.data()の初期値ですらなかった data-***属性が初期値であるのはおまけ程度に考えたほうがいいだろう : Name_Not_Found [sage] 2015/03/28(土) 02:47:33.51 ID:??? data-* 属性は文字列でなくてはいけない .data()でセットできるのはオブジェクト これを考えてみると、.data()にセットしたものをdata-*属性に反映させるというのが 無茶というのがわかるでしょう ちなみに、data-*属性にJSON形式でセットしておくと、 .data() で取り出した時にはデコードされている これを可逆にするんなら、.data()でセットできるオブジェクトは JSON形式にできるものだけになっちゃう これも今更無理 : Name_Not_Found [sage] 2015/03/28(土) 04:35:47.15 ID:??? 文字列でなければならないのではなく、HTMLの属性値なので取得時にJSの文字列になりますよということ。与える時には数値でも何でもよくて、それをJSでsetAttribute() すれば文字列表現に変換される。 無茶でも何でもない。JSのオブジェクトリテラルをそのままセットすれば良いだけ。 : Name_Not_Found [sage] 2015/03/28(土) 04:44:27.29 ID:??? 何故JSON? その略語を展開すれば解ると思うが、そもそもそれはJSのオブジェクトリテラルに制限を付けたサブセットだ。 だから、JSのオブジェクトリテラルそのままを書けば良いだけ。 もっと古きを言えば、そもそもオブジェクトリテラル自体は読み取り時の表現形式だったが、17年前くらいにJSコードで書けるようになった。JSのデータ表現文字列としてはそれ以前の本当に初期から存在するのに知らないとかどうかしてるだろ君は草 : Name_Not_Found [sage] 2015/03/28(土) 04:55:08.85 ID:??? ていうか、IE4からIEには18年もexpandoプロパティというものがあってだな、data-* なんてのはそれをパクった上に属性名(JS用語だとプロパティ名)を別物にしてIE非対応としてIEを貶めるための嫌らしい政治的戦略なわけだ。 とりあえずそのexpandoには何でもセット出来た。 もっと言えばだな、IE5.5には#default#userDataというものがあってだな、その中でmsxmlやり放題だったわけ。その超絶有用な発展的独自仕様を捨てるそうだが、糞なHTML5にダウングレードするのは楽だがアホらしい作業だろうなと同情するわ。 : Name_Not_Found [sage] 2015/03/28(土) 05:08:45.62 ID:??? まあとりあえずそのjQueryの実装は手抜きだな。 飽きてんだろうな、ソース読んでもテキトーにやってます感が漂っている感じがする。 jQuery終わっとるな。 たぶん、backbonejs未満のヘルパーライブラリーに集約されるんだろうな。 要らん工夫は要らんと。 たとえば、今更のprototypejsをprototypeじゃなくてオブジェクト(いわゆるクラス)のメソッドとして定義する。 使う時はcall/apply強制ということ。 たとえば今のArray.map(ArrayLike, ...thisObj)みたいな使い方。 しかしこれは現在猛烈に普及中のアロー関数で面倒くさいことになる。 なかなかうまくいかないねえ。 : Name_Not_Found [sage] 2015/03/28(土) 05:35:04.60 ID:??? ソース読むだけでテキトーかどうかわかるのか。凄いなあ 俺もその能力が欲しい : Name_Not_Found [sage] 2015/03/28(土) 08:02:32.37 ID:??? JSON形式にしてセットする仕様だとして var a = {}; a.foo = a; $('div').data('bar', a); としたらどうなるか考えて見ればいい : Name_Not_Found [sage] 2015/03/28(土) 09:21:56.80 ID:??? data-*属性に格納する例だからJSONなのでは? : Name_Not_Found [] 2015/03/28(土) 11:58:13.92 :IZc5QMVF HTML5でフォームの各inputにrequired属性を指定しています。 PC版のChrome等ではフォームを実行しようとするとエラーを出して実行されませんが、 スマホからだと素通りしてフォームが実行されてしまいます。 そこで、JavaScriptでValidationのチェックをしようと思うのですが、 HTML5のpatternやrequiredなどからエラーを出してくれる(HTML側の設定を使い、JavaScriptでValidationの設定をしなくて良い)ライブラリはないでしょうか? : Name_Not_Found [sage] 2015/03/28(土) 12:03:41.45 ID:??? > まあとりあえずそのjQueryの実装は手抜きだな。 違うよ。よりよい実装だよ。 例えば、element.onclickに代入しても、 要素のonclick属性は作られない。 それと一緒だよ。 : Name_Not_Found [sage] 2015/03/28(土) 12:10:13.93 ID:??? じゃあこれだとどうなると思う? var a = {} a.foo = function() {}; a.bar = new Bar(); $('div').data('bar', a); 要素に紐付けたいデータというのは 文字列に出来るものだけじゃなくて、 オブジェクトも有りえるんだよ。 datasetで出来るのは文字列で表せるものだけ。 だから限界があるんだよね。 : Name_Not_Found [sage] 2015/03/28(土) 12:22:51.72 ID:??? 勿論、無理だよ そんな制限はわかった上での発言だと見たけどね : Name_Not_Found [sage] 2015/03/28(土) 12:35:34.39 ID:??? そもそも、は「data-* 属性は文字列でなくてはいけない」 といっているのだから何も間違ってない 最も、.は「data() ではオブジェクトリテラルを使える」と反論しているようにも見えるけどね だとしたらまるで噛み合ってないね : Name_Not_Found [sage] 2015/03/28(土) 12:52:54.58 ID:??? > ていうか、IE4からIEには18年もexpandoプロパティというものがあってだな expandoプロパティはJavaScript、data-*属性はHTMLなわけで役割がまるで違う ただのデータ格納庫としか見ないからそんな変な発想になる > もっと言えばだな、IE5.5には#default#userDataというものがあってだな 過去に Node#setUserdata を標準化する動きがあったが、廃止された 代替機能は ES6 の WeakMap あたりが妥当かね 何でもかんでも標準化すればいいってわけじゃない : Name_Not_Found [] 2015/03/31(火) 19:55:00.12 :xPIMV4ox 要素が画面に入ってからアニメーションをしたいのですが、 要素が画面に入った時の判定?がわかりません どうすればいいですか? : Name_Not_Found [] 2015/03/31(火) 20:22:12.37 :xPIMV4ox 解決しました : Name_Not_Found [sage] 2015/04/03(金) 22:05:51.80 ID:??? 別ドメインの.jsファイルをWebStorageにキャッシュするという 単機能のライブラリを以前どこかで見たのですが 名前を控えておらず検索してもちっとも引っ掛かりません それっぽいものか同等のものがあれば教えて下さい : Name_Not_Found [sage] 2015/04/13(月) 17:14:14.09 ID:??? + JavaScript の質問用スレから誘導されました。 DW5.5を使っています。トップページにスライドショーを設置したく、 ttp://makasete-web.net/bxslider 上記を参考に書いてある通りやってみたのですが、上手く表示されません。 スライドには3枚の画像を使っているのですが、 DWのライブビューには縦に3枚表示されている状態です。 ブラウザ(サファリ)でも同じように縦に3枚表示されています。 ソースコードはコピペで貼付けているため、ミスは考え辛いのですが、 何か根本的に間違っている箇所があるのでしょうか? まず上記サイトからダウンロードしたファイルのうち、 imagesの中にある画像2枚を既に当方のサイトで作成済みだったimages(ローカル)フォルダの中へ。 jquery.bxslider.cssをcss(ローカル)フォルダの中へ。 jquery.bxslider.min.jsをindex.htmlと同じ階層へ。 ちなみにimages、css両フォルダはindex.htmlと同じ階層にあります。 長過ぎと言われたので一旦切ります。 : Name_Not_Found [sage] 2015/04/13(月) 17:15:32.65 ID:??? 続きです 記述内容は、head内に <script src=" ttps://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="js/jquery.bxslider.min.js"></script> <link href="css/jquery.bxslider.css" rel="stylesheet" /> <script type="text/javascript"> $(document).ready(function(){ $('.bxslider').bxSlider({ auto: true, }); }); </script> body内に <ul class="bxslider"> <li><img src="images/top_1.jpg" title="画像1" /></li> <li><img src="images/top_2.jpg" title="画像2" /></li> <li><img src="images/top_3.jpg" title="画像3" /></li> </ul> としていますが、上記の通りライブビューでもブラウザ(サファリ)でも指定した画像が縦に3枚表示されるのみで、 スライドショーにはなっていない状況です。 どなたかアドバイスをお願い致します。 : Name_Not_Found [sage] 2015/04/19(日) 14:42:58.22 ID:??? cssが効いてないんじゃない 知らんけど : Name_Not_Found [sage] 2015/04/25(土) 07:57:32.28 ID:??? ttp://iand2ch.net/test/read.cgi/hp/1429873274/10 への回答。 githubにサポートブラウザが載ってるよ。 > Browser Compatibility > PEP should work on IE 10+ and the latest versions of Chrome, Safari, Firefox, and Opera. ttps://github.com/jquery/pep#readme : Name_Not_Found [sage] 2015/05/11(月) 07:54:04.69 ID:??? 只今個人でウェブサイトを作っていて複数の画像を回転させようとしているのですが ひとつづつに動作を記述すのがめんどいので同じ所は関数を作ってまとめようと思い 自分なりに考えてやってみたのですがうまくいきません汗 よかったらどうすればいいのか教えてください 一応個別で一つづつ書いた場合は回転しました。 サンプル html--------------------- <html> <head> <script src="jQueryRotate.js" type="text/javascript"></script> <script src="rolling.js" type="text/javascript"></script> </head> <body> <img id="imge001"> <img id="imge002"> </body> </html> rolling.js----------------------- $(function(){ function rollin(nam1,nam2){ $(function(){ var angle = 0; setInterval(function(){ angle+= nam1; $("nam2").rotate(angle); },10);// rollin(5,image001); rollin(2,image002); }); : Name_Not_Found [sage] 2015/05/11(月) 08:39:43.26 ID:??? > $("nam2").rotate(angle); nam2要素が存在しないので動く訳ないと思うんだけどなあ HTMLのid属性値もtypoしてるし、張り付けるコードは動くことを確認してないよね? あと、配布サイトのURLを貼ってくれないかな ttp://uzmk.jp/blog/tips/entry-229.html 上記URLだとして、 $("#imge001, #imge002").rotate(angle); で期待通りに動作すると思われる 他にもtypoありそうだし、検証はしてないけど方法としてはいけると思う まあ、俺なら全てに同じクラスを付けてセレクタの手間を省くけど : Name_Not_Found [sage] 2015/05/11(月) 09:22:23.20 ID:??? ありがとうございます nam1,nam2は、function rollin(nam1,nam2)で定義したと思ってました汗 別で定義しないといけないのですか? 参考urlはそこであってます 御手数御掛けして申し訳ありません あと今回は回転自体は複数でさせようと思うのですが 速度や向きは変えたいのでその数値だけ引数で指定したいと思っています汗 何分初心者なのでもっと勉強させてください : Name_Not_Found [sage] 2015/05/11(月) 13:30:02.71 ID:??? ダブルクォートで囲んじゃったら変数じゃないでしょ : Name_Not_Found [sage] 2015/05/11(月) 14:33:58.19 ID:??? セレクターのグルーピングはCSSを書く段階ですらレガシーバグ対策の為に回避する類の物なので、jQueryがわざわざそこを実装してやる必要性が皆無だ。 こういう所からしても設計思想が欠如しているとしか言いようがない。 言うまでもなくjQueryはJSそのものなのでCSSのような設定ファイルではない。設定ファイルで便利だったグルーピングは処理手順ファイルでは不透明でバグの温床にしかならない。 : Name_Not_Found [sage] 2015/05/11(月) 20:29:59.60 ID:??? とりあえずお前が何も読んでないで意味不明な ことを言ってるだけの馬鹿だってことは分かったよ : Name_Not_Found [sage] 2015/05/25(月) 18:47:08.41 ID:??? openlayers3について質問させてください ttp://openlayers.org/en/v3.5.0/examples/kml-timezones.html をそのままコピーして ローカルで実行したのですが,サンプルのようにTimezonesが表示されません(地図は表示されます) kmlファイルは ttps://github.com/openlayers/ol3 にあるdataフォルダをhtmlと同じ階層に設置しました 他のkmlファイルを読み込むサンプルも同様に動かないのですが何が原因でしょうか : Name_Not_Found [sage] 2015/05/29(金) 19:29:22.48 ID:??? マルチポストしてる 下記スレに移動したようなのでこの質問はクローズかな ttp://peace.2ch.net/test/read.cgi/tech/1417749547/131- : Name_Not_Found [sage] 2015/05/29(金) 22:11:51.07 ID:??? 考えたらマルチポストなんて簡単に規制出来るのに、2chの運営って意味わからん。 : Name_Not_Found [sage] 2015/07/02(木) 02:57:19.56 ID:??? 横並びの要素の高さを揃えるライブラリって何使っている? fixHeightを使ってたんだけどjQueryのバージョン上げたら使えなくなった : Name_Not_Found [sage] 2015/07/02(木) 06:12:14.60 ID:??? display: table : Name_Not_Found [sage] 2015/07/02(木) 13:16:36.93 ID:??? 複数段の場合にもdisplay: table使っているの? : Name_Not_Found [sage] 2015/07/02(木) 16:51:33.58 ID:??? 横からだけど…。 モダンブラウザなら display: box IE8 を考慮するなら上記に加えて display: table IE7 を考慮するなら上記に加えて JavaScript(簡単だからライブラリを使うまでもなく自作する) : Name_Not_Found [sage] 2015/07/02(木) 23:00:47.22 ID:??? tableタグ使ったほうが早いw : Name_Not_Found [sag] 2015/07/19(日) 19:43:23.81 ID:??? ttps://gist.github.com/anonymous/1944f34703bcb63131d8 このトピでトピ主に反論している、anonymous10000の言っている事がいまいちよくわからんのだが、 誰かわかる人居る? : Name_Not_Found [sage] 2015/07/20(月) 03:31:48.52 ID:??? トピマス殿! gistはこんな使い方もできるんだねえw
凡例:
レス番
100 (赤) → 2つ以上レスが付いている
100 (紫) → 1つ以上レスが付いている
名前
名無しさん (青) → sage のレス
名無しさん (緑) → age のレス
ID
ID:xxxxxxx (赤) → 発言が3つ以上のID
ID:xxxxxxx (青) → 発言が2つ以上のID
このページは2ch勢いランキング が作成したアーカイブです。削除についてはこちら 。