+ JavaScript & jQuery 質問用スレッド vol.8 +
■ このスレッドは過去ログ倉庫に格納されています
JavaScript を自ら学ぶ人のための質問スレッドです。 >>2-4 のテンプレを読んだ上で質問してください。次スレは>>950 が>>2 のテンプレ案(本スレで改善案があれば考慮)を元に立ててください ■質問を書く上で (1) 煽り、コード制作依頼等、人を不快にさせる投稿はご遠慮下さい。公序良俗を守った応対を心がけてください。 (2) 他の人に迷惑をかけるスクリプトの質問はご遠慮ください。 (ブラクラ、[戻る], [閉じる], [クリック] の妨害、画面占有など) (3) 質問者及び議論を行う人はメール欄を空欄にし、名前にレス番を入れることを強く推奨します。回答者はなりすましを判断できませんので、なりすましが現れても自己責任となります。 (4) 常に自発的に調べる心構えを持ってください。 具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。 わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。 (5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。 (6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。 ※必ず「問題の事象が再現されること」を確認してください。 必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。 (7) サンプルコードに HTML が含まれる場合は http://validator.w3.org/ で [Check] してみてください。 (8) 質問を具体的かつ詳細に書くと回答を得られやすいです。>>2 の質問テンプレートを活用してみてください。 (9) 時にはあなたが望む「答え」だけでなく、「意見」などが寄せられる場合もあります。 + JavaScript & jQuery 質問用スレッド vol.7 + [無断転載禁止]©2ch.net http://mevius.2ch.net/test/read.cgi/hp/1467906819/ それでjQueryちゃんは ○文字節約できます! 以外にどんな機能を提供してくれるの >>159 関数型風のプログラミング機能 あと機能じゃないが開発工数の削減と バグを減らしてくれる 開発工数の削減って○文字節約できますを言い換えただけだろw 開発工数の削減ってそんなに重要なことなのかって話だよ >>143 横から申し訳ない カスタムエレメントってどういうときに使うもの? いまいち理解できんのでよかったら教えてくれ カスタムエレメントがほしいって思ったことがない つまりHTMLパーツのコンポーネント化っていう 概念がなくて行き当たりばったりでCSSでデザインしてるだけ こういうやつもいるからjQueryでクラス使って コンポーネントに対して処理をする便利さが理解できないんだろうな >>153 それな jQueryの代替のフレームワークはJavaScriptのフレームワークで HTML+CSSメインの作り方からJavaScriptメインに 代わってしまう。 わかりやすく言えばプログラミングできなきゃ HTMLも表示できない。jQueryの利用者が今も増え続けてる理由だよ https://w3techs.com/technologies/history_overview/javascript_library/all ここ二ヶ月の間73.2%から増えてないから とうとう上げ止まったか?と思ったら今月73.3%になった よかった。jQueryの利用者はまだ増え続けてたんだ。 >>164 要素をカスタムしたい場合、という回答では不十分か? 今回の件に限らないけど、どうして何かしら例を出した程度の場合に そいつにその物事についての説明やサンプルを求めるのかがさっぽり理解できない 俺の考えを知りたいのか?、それとも俺を試してるつもりなのか? そんなの適当にググって出てくるサイトの筆者の方がよっぽど詳しいし よっぽどためになる事書いてあるに決まってるだろう 俺はカスタムエレメントの申し子じゃないんだからさ でもとりあえず上のclassの話で回答しておくと、 要素に何かしらの機能や性質を持たせる、という考え方と違うものとして 何かしらの機能や性質を持った要素が定義してあって、それを使うという考え方を挙げた 例えば一部で幾つか配列操作メソッドがほしいときに、 Array.prortotype、もしくはArrayのインスタンスにメソッドがを定義するのではなく、 Arrayをextendsしたクラスを用意しておいて、必要なときではそちらでインスタンスを作るということ、 このたとえならjQueryはlodashを使うことに近いのかもしれない ただし、そのlodashは入出力がArrayではなく、独自のArrayLikeオブジェクトになってるって感じ そこがちょっと無視できないポイント つまり基本的にlodash世界内で完結するように書くものであって、 lodashに一旦通して配列を加工して、lodash空間はそこで一旦終わらせて、 次に別のものに通していくってことが、ロジック上難しいのではないけれど、概念上困難ということになる 俺が変わりに答えてあげるけど jQueryならサクッとできることが カスタムエレメントだとすごく大変 custom components は、React とかだろ JS は、Ruby, Python みたいに、 バッテリー同梱(batteries included)じゃないから、 標準ライブラリ・フレームワークが無く、自分で探さないといけない 各ブラウザ・スマホの実行環境を考慮した結果、標準にしない方がよい。 標準にすると、性能などで困るメーカーが出てくる >>170 >>685 でズバリ具体例を言ってるだろ、コードが欲しいってことか? 具体的に何の具体例をどういう目的で欲してるのかも分からんし そんなん比較で色々書いてたら俺が書いてきた長文以上の量になるだろう 複数の要素を扱うってことで例を考えるとHTMLだけでもそれなりになるし 書く意味も分からんし書く気は無いよ >>171 Reactは1ミリもweb component/custom elementと関係ありません。 知ったかするな! しいていうならPolymerだバカ Railsにincludedされてるバッテリー風情がイキがっててワロタwwwww Web Componentsが各ブラウザでネイティブに実装されたら 今のAngularやReactなどのフレームワークは死滅する 一番の問題はフレームワークと共存できないということ フレームワーク側もシェア維持のためにWeb Componentsに対応するのだろうが 今と作り方がまったく変わってしまう だけどjQueryはただのライブラリなので、Web Componentsと共存できる 部分的にjQuery、部分的にWeb Componentsを使と言うことが可能 またWeb Components時代になってもコンポーネントとコンポーネントをつなぐ 必要がある。ここにjQueryは使うことができる。 コンポーネントが見つからない場合、今までどおりjQueryを使うこともできる 混ぜて使うことが可能。これがjQueryの大きなメリット >>181 <honoka></honoka> とかやっておくとかわいい女の子が表示される みたいなものw じゃあ、bodyに<all></all>と書くだけで ページ全部が作れるのか カスタムタグとかカスタムエレメントとかウェブコンポーネントとか 正直全部どうでもいい そんなのより 全部のブラウザでasync/await使えるようにしてくれよ いつだよ >>167 「jQueryは死んだ」というのが流行ってただけで 実際はむしろ成長中だったのですね urlにおもいっきりJavascriptライブラリって書いてあるやんけ。 しいていうならJavascriptは永久に100% Javascriptはお釈迦さま。てのひらの上で一番うまく踊れるのが誰か競ってるのがライブラリ。 >>191 ブラウザがお釈迦様。手のひらの上で踊らされてるのがフロントエンドエンジニア。 >>191 リンク先には各ライブラリのシェアだけではなく ライブラリを使わないというNoneもはいってるよ だから正確には、どのライブラリ or ライブラリを使わないで競ってることになる ライブラリを使わないっていうのは素のJavaScriptを使うという意味だ お前が言うJavaScriptはライブラリを使わないという意味じゃなかったのか? それともjQueryを使っていてもJavaScript100%に含まれる (だからこのスレの話題としてOKってことか) Noneの割合は年々減っている。現在は23.7%。 最近は一年で1%減るぐらいのペース jQueryはその逆で一年で1%増えるぐらいのペース 正直手のひらの上で踊らされてるのは、 流行りものに流されっぱなしの JavaScripterだけな気がするw jQuery使いはストイックだよ もう10年も踊ってない ライブラリは言語に足りない部分を実現して 言語の未来の形を先取りしているものなので、お釈迦様というのは言い過ぎではないでしょうか? ライブラリに先導されてJavaScriptはその後をヨチヨチと付いてきているのですから むしろライブラリの方がお釈迦様的です ライブラリはjavascriptで実現可能なことしか実現できない。 javascriptで書かれてるからなw 高級言語はアセンブラで実現可能なことしか実現できない。 できることと言ったら実現可能なことを、早く安く作れるだけだ ライブラリもそれと同じ こればっかりはアセンブラでは実現できないw >>193 その None にはスクリプトすら使わないというのは入っているのかな? Noneの中にJavaScriptすら使わないのがはいっていたら 生JavaScriptを使ってる人はもっと少なくなるな どうせサイト全体でロード記述がどっかにあるかどうかでしょ 機能単位で見たら生jsクソほどありそう >>200 調査方法載ってないんだよな 調査方法載ってないデータはクソ サイトの一覧ないと再検証できないじゃん この手の調査はだいたいそんなもん >あなたの主張からすると調査方法載ってるので >クソではないということになりました。 具体的な調査方法が一切無い時点でクソ たとえばあるサイトにwordpressがどっかにあればそのサイトは各種ライブラリを使っている!と判断されるかもしれない 少なくとも「新たな開発に○○を使っているかどうか」の実証にはなりえない > 彼らが望むのであれば、ウェブサイトはほとんどの技術を隠すことができるため、 > このタイプの調査は100%正確であることは不可能です。 Webサイトのサーバ側で使ってる言語なんかはともかく ライブラリも含めて難読化でもしない限りフロント側はかなりわかるはずだよね w3techsっていう怪しいコンサル会社がやってる怪しいリポートしか出すものが無いという事実 良くわからん計算で勝手にこのドメインのアクセス数はいくつ、時価は何ドル、ってやってるクソサイトと同列 sites infoで自家鯖ドメインがNTTのクラウド使ってるとか診断されてて草 > >あなたの主張からすると調査方法載ってるので > >クソではないということになりました。 > > 具体的な調査方法が一切無い時点でクソ こっちに具体的な調査方法が書いてあるよ。 + JavaScript の質問用スレッド vol.132 + https://mevius.5ch.net/test/read.cgi/hp/1520329583/742 >>202 > サイトの一覧ないと再検証できないじゃん それは、自分で複数のサイト(少なくとも数千レベル)を調べて こうだったって言えば良いのでは? 再検証はできなくても反論はできるでしょ? 再検証できないじゃんというだけじゃ反論にはならないので 相手のデータを否定したことにはならない。 証拠なし根拠なしだから論証にすらなっていないので反論の必要がない データを否定するもなにも w3techsのはデータじゃなくて妄想 それを根拠に語るお前も妄想 あぁ、こっちのスレでは調査方法書いてないから こっちでやろうとしてるのか。卑怯だなw むこうのスレからコピペするね。 調査方法は以下に書いてますね https://w3techs.com/faq > 調査方法載ってないデータはクソ あなたの主張からすると調査方法載ってるので クソではないということになりました。 英語わからないならGoogle翻訳使うといいですよ。 > どの技術がサイトで使用されているかをどのように知っていますか? > > 主に、Webページのダウンロード時にサイト自体が提供する情報を使用します。 > 言い換えれば、私たちは検索エンジンのようなWebページを取得し、その結果を分析します。 > さらに、Alexa、Google、Microsoft、ipinfo.ioなどのソースから公に入手可能な情報を使用しています 。 英語がわからなくてgoogle翻訳使ってんの自分じゃん?w 英語のまま貼ってもいいけど、読まないやつは読み飛ばすだろうからね かと言って俺が翻訳するのは面倒 >>209 主にトップページしか検索の対象にしてないってかいてるやんw クソデータ決定だなw ほらな。だから日本語に翻訳してコピペする必要があるんだよ(苦笑) しっかり書いてある。英語を読まないから見つけられない > あなたはホームページだけ、あるいは内部のページだけを分析しますか? > > それはサイトについて既に知っているものに依存します。 > しばしばそれはホームページでしかありません。 > 多くの場合、我々はより深くクロールします。 >>209 卑怯ってなんだよw あっちはすれ違いだろ 勝手にお前があっちに貼ってるだけだろ ばかじゃねぇの? 分散させようとしてスレ違いのとこにかってに書き込んでるお前が卑怯だろ。 頭いかれてるっぽいなこいつ。 > Do you analyze only the home page or also inner pages? > > That depends on what we know already about the site. > Often it's only the home page, in many cases we crawl deeper. なお翻訳前の英語。短いから手動で訳してあげると あなたはホームページだけを解析しますか? それとも内部のメージも? 私達がすでに知っているサイトの内容に依存します。 しばしば、それはホームページだけですが、多くの場合、私達は深くクロールします。 Often it's only the home page, in many cases we crawl deeper. これは基本トップだけ検索してます。でもより深くまでクロールすることもあるよって意味ですが? コンマの意味分からんのか? 比率は何対何かぜんぜん分からんなこれ。計測仕様もクソもない >>218 「in many cases」をどこにどうやって入れるつもり?w 「Often」も省略してるよなw 重要な単語を2つ省略する自称英検一級www oftenはオフンではなくおふとん!と発音するとアメリカのインテリから一目置かれるよ! 一々、翻訳しなくても、 Egde のプラグインの、翻訳ボタンを押せば、そのページを翻訳できる chromeのコンソールで var T = (function() { return {a: 3}; }).prototype.aaa = function() {}; new T; ってやったら凄い勢いでchrome 全ウィンドウ落ちてタブも復元できなかったwww みんなもお試しあれ ページのリダイレクト先について質問です。 <!DOCTYPE html> <html> <head> <title></title> <meta http-equiv="refresh" content="1;URL=PCで飛ばしたいURL"> <script type="text/javascript"> if ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0) { location.href = 'PC以外で飛ばしたいURL'; } </script> </head> <body> </body> </html> この書き方ですと、PCでは「PCで飛ばしたいURL」へ飛びますが、PC以外では「PC以外で飛ばしたいURL」に飛びます。 ここで質問なのですが、android端末のみに飛ばしたいURLを指定する場合、どのようにscriptを記載すれば宜しいのでしょうか? if (navigator.userAgent.indexOf('Android') > 0) { location.href = 'android端末のみに飛ばしたいURL'; } else if ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0) { location.href = 'PC以外で飛ばしたいURL'; } >>226 正常に動く T.aaa {} と表示される 誰でもできる在宅ワーク儲かる方法 少しでも多くの方の役に立ちたいです グーグルで検索するといいかも『金持ちになりたい 鎌野介メソッド』 F8AFC >>230 マルチ広告死ね。儲かる言ってる割に宣伝必死だなww 借金で首吊れやwww ホームページ例 http://www.kigyo88.com/visa/ このホームページの外国語タブ使われているのは、JavaScriptでしょうか? それでこのような翻訳機能が出来るやり方が載っている『本』とかありましたら 教えていただけないでしょうか? 言語が違う全く同じ内容を最初から4つ用意しておいて 表示を切り替えてるだけだから、JSもシンプルだし、別にラジオボタンとCSSでもできる でも勿論それが銀の弾丸というわけではない コンテンツがシンプルで量もそれほどない、という前提があって使えることだし、 もしかすると翻訳のことも考えた結果のデザインになっているのかもしれない つまり何かを実現するための方法というのはその時その時の他の要素で大きく変わるし、 何かを実現しやすくするために別の何かを調整しておかないといけないことも多いので そんな話は簡単ではないし、勿論本を見て勉強するようなことではないということ 所謂応用力だから let a = $('<p>a</p>'); let b = $('<p>b</p>'); $('#hoge').html([a,b]); このようにhtmlメソッドにjQueryオブジェクトの配列を渡したら問題なく動作しました 何故でしょうか? ちなみにもともとはjQueryオブジェクトの配列を要素にappendしていたのを、 追加ではなく入れ替えたいと思ってやってみたら動作したいう次第です >>233 なるほど、これは翻訳をあらかじめ用意してるだけなんですか。 ありがとうございました。 >>234 jQueryはよくできているからです。 以前はマウスホイールイベントを扱うのにjquery-mousewheelプラグインを使っていましたが 今はjquery自身が実装してるのでしょうか? mousewheel jqueryでググるとまだjquery-mousewheelがトップに出てきますが、 更新が止まってますし、対象期間を1年以内にすると消えます 仕事でIEのブラウザ上を普通にctrl cコピーしてExcelに貼ることが多いんだけど、セル一枠がクレジットカード番号のみ情報が混じってると勝手に16文字目が0にされてしまう セルに直接クレジットカード番号打ち直せばいいんだけど、いちいち結構な手間になってしまう 特にブラウザのCSSのデザインもExcel上に残したいからなおさら Excelのフォーマットの文字列に該当する設定ってJavaScriptでできたりする? Excel の数値型の精度が、15桁までしかないのかも。 Excelに、文字列型と解釈させれば良いかも 20桁ぐらいある数値を、Excelにコピーして試してみれば? >>239 jQueryやそれらの古いライブラリはまだpassiveに対応してないので 現状では実質使えないものとなってるがv4.0で対応予定 https://github.com/jquery/jquery/issues/2871 ここを追うと良い v4.0までは自分でライブラリ書くと良いよ ありがとうございます passive event listenerっていうのは初耳です $(document).on('wheel', function (event){ console.log(event.originalEvent.deltaY); }) 初心者質問で申し訳ありません。 radioボタンのチェックされた要素番号(?)はjQueryでどう取得したらよいので しょうか。何がしたいのかというと、例えば第一希望、第二希望、第三希望を ラジオボタンで選択するのですが、その際、第一希望でチェックされたものは 他の希望は選択できないようにしたいのです。 <input class="kibo01" type="radio" name="第一希望" value="2018/06/01">6/1 ・・・ <input class="kibo02" type="radio" name="第二希望" value="2018/06/01">6/1 ・・・ <input class="kibo03" type="radio" name="第三希望" value="2018/06/01">6/1 ・・・ 各classの順番は同じなので、クラスを取得して添え字を基準にdisabledにしているのですが、 jQueryを使えばIE7でも動作するのかなと思っての質問です。 name属性やvalueが日本語、Shift-JISで使えないようなので、クラスを利用したいのです。 jQueryならこうするでも構いません。どうぞ、よろしくお願いします。 君は、ラジオボタンの基本から間違っている。 name 属性は同じにしないと、同じグループにならない まず、HTML のラジオボタンから勉強せよ 「html radio checked」「jquery radio checked」で検索! 【jQuery入門】ラジオボタン(radio要素)の取得・選択・checked操作! https://www.sejuku.net/blog/46739 >>246 私の説明が下手だとは思うのですが、 第一希望のラジオグループと、第二希望、第三希望のラジオグループがあって、 それぞれ同じ項目を持っており、一つのラジオグループで選択された項目を 他のラジオグループではdisabledにしたいのです。 全部書かずに省略した"・・・"なのです。 jQueryのchange()によるイベント処理操作まとめ! https://www.sejuku.net/blog/41231 ラジオボタンのchangeイベントで、 一つのラジオグループで選択された項目を、 他のラジオグループではdisabledに設定すれば? >name="第一希望" 半角文字以外を使うな >>249 そうするために、要素(添え字)の数を知りたいと思っているのですが・・・。 val()で値を取得して、該当するものを探す方法でもいいんですがそれが わからないので質問しているのです。ご紹介のサイトでは 説明をみつけられませんでした。 (値が同じという前提ではないので、値は使いたくないのですが、 それでも構いません) ANK不使用については大前提なのです。 なにやりたいのさっぱりだっから、これよんで勉強しろ <input name="group" type="radio" value="1">1 <input name="group" type="radio" value="2">2 <input name="group" type="radio" value="3">3 <input name="group" type="radio" value="4">4 <input name="group" type="radio" value="5">5 $('[name="group"]').on('change', function() { alert($(this.form || document).find('[name="group"]').index(this)); }); <div id="radio_1"> <input type="radio" name="radio_1" value="1"> <input type="radio" name="radio_1" value="2"> <input type="radio" name="radio_1" value="3"> </div> <div id="radio_2"> <input type="radio" name="radio_2" value="a"> <input type="radio" name="radio_2" value="b"> <input type="radio" name="radio_2" value="c"> </div> $('#radio_1 > input').on('change', function() { $('#radio_2 > input').removeAttr('disabled'); // 削除 var value = $(this).val(); console.log(value); if ( value === '2' ) { $('#radio_2 > input[value="b"]').attr('disabled', 'disabled') } }); radio_1 が2 なら、radio_2 のb を、disabled にする。 value を使うのなら、radio_1, radio_2 の対応表がいる 1 - a 2 - b 3 - c nth-childやeq使ったり、data属性でグループ化したらいいんじゃにの Javascriptでは例えばこうしています。onChangeで呼び出し。 function hoge() { var kibo1 = document.getElementsByClassName("kibo01"); var kibo2 = document.getElementsByClassName("kibo02"); //初期化 for (var k = 0; k < objA.length; k++) { kibo1[k].disabled = false; kibo2[k].disabled = false; } //クラスkibo01がチェック済 var idx; var flg = false; for (var i = 0; i < kibo1.length; i++) { if (kibo1[i].checked) { idx = i; flg = true; break; } } if (flg) { kibo2[idx].disabled = true; } //以下、クラスkibo02の場合が続く } 連投すみません。 >>253 つたない説明で申し訳ない。 nameが日本語で、文字コードはShift-JISなのですが、動きますか? さくっと書いたものでは動作しませんでした。 他の書いた部分が違ったのかもしれませんけれど。 >>254 コードをありがとう。value値で引っ張るのですね。日本語通るか試してみます。 ※ただ、選択肢が増えたり変更した場合にJavascriptを書き換えないといけないのと 正直、例えば20位の選択肢の第3希望までを、ifなりswitchなりで分岐するのはいかがなものかと。 >>255 正しくないのですが、(さくっと書いたら動かなかった) var i = $(".kibo01:checkd).index();//そもそもindex()が正しいのかわからない $(".kibo02:eq(+i+)").attr("disabled", true); とかしたいのです。 どのように書いたらいいんでしょうか。 nth-childやdata属性は使ったことがないので調べてみます。 みなさん、ありがとう。 文字コードは、BOM なしUTF-8 以外は、使わないように プログラミングの基本は、半角文字だけ。 全角文字などは、テキスト部分だけに使うように HTML, jQueryの基礎から勉強して、わからない事は検索するように 素のJavaScript で、プログラミングしないように >256 のようなループ処理を読むのが面倒だから 選択肢の数が変動するなら、汎用的に作らないといけないから、 簡単にプログラミングできない >254 のような、radio_1 と、radio_2 の対応表が必要 ■ このスレッドは過去ログ倉庫に格納されています
read.cgi ver 07.5.5 2024/06/08 Walang Kapalit ★ | Donguri System Team 5ちゃんねる