+ 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/ >>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 の対応表が必要 >>259 酔っ払ってる? 気を悪くしたら申し訳ないのですが、 たぶん私の方が貴方より諸々理解していると思います。 回答しようとしてくれる気持ちはありがたいです。本当に。 土日は所用があり試せていませんが、ちょっと思いついたこともあります。 また試してみたく思います。ありがとうございました。 Jqueryのajaxで他のhtmlファイルを読み込んでそいつをgetElementByIdとかで DOM操作してやりたいのですがやり方が分かりません。 XMLHttpRequestでゴリゴリ行くならばresponseTypeにdocumentを指定してやれば responseXMLをそのまま使えるのですがJqueryではどうすればいいでしょうか? $.ajax({ type: "POST", url: "/hoehoe.php" , data: { key: "ほえほえ" }, dataType: "html", timeout: 10000 }).done(function(html) { console.log($(html)[0].getElementById('xxx')) }); }); 普通に考えてこんな感じでやってみたりしてるんですが上手く行かず 末端の方だと$(html).find("#xxx")で取れなくもないのですが ルートの上の方で子要素が沢山ある場合失敗するような感じ 自己レス、分かりました。 findで絞る場合、body直下のタグはダメなんですね。 >>264 HTML入門とかいう本を読んだほうが良い と思ったけどもbody直下以外にも取得できなかったりしてダメだな。何が悪いんだろう。 他のHTML ファイルを読み込むって、他のドメインからは、 Cross-Origin Resource Sharing (CORS) で読み込めないだろ 例えば、自分のwebページから、 5ch のHTML を、iframe 内に読み込んでも、 他のドメインのwebページだから、アクセスできない だから、ブラウザから直接では、アクセスできないので、 自分のPC に、webサーバーを立てて、そこ経由でアクセスしないといけない Ruby の標準サーバー、WEBrick とかを立てる >>263 ・htmlを画面表示していますか? 表示しないと(console表示だけだと)documentの関数は使えないと思います。 ・表示したのであれば、単純に("#xxx")で取得できると思います。 あえてgetElementByIdを使う理由があるのでしょうか。 ごめんなさい。 ここでいうhtmlというのは"hoehoe.php"で作られるファイルのことです。 >>266 更に自己レス、単純にpostで得られるドキュメントがエラー吐いてて 想定の形式じゃなかったからこっちもエラー吐いてただけの模様。 寝ないで作業するととこんな単純なことも見逃す脳みそになってしまうという言い訳。 ただ、それだけじゃ説明できないことも有るような気が戦でもないけどとりあえずちゃんと動いてるので検証はしない。 多分気のせい。そうに違いない(願望 >>270 あえて使わない理由は特に無いですが 普段jqueryは使わないのとgetElement系も自前でワッパー定義してて 実際は$i("id")とかでもっと短く書けてるのでこっちのが便利なんです >>272 解決おめでとうございます。お疲れ様です。 アルト、エネーブル、ブーリーンという人は知っていますが ワッパーは初めてです。 ゥラッパーって必ず小さいウ入れてくる奴はいた。吹き出さないよう必死だった俺。 動的に作った大きめのtableをremoveすると時間がかかるのですが、短時間でremoveする方法はあるでしょうか >>278 普通は時間がかかることはない 時間がかかるのは削除する情報が多い場合 その情報とはイベントハンドラとデータ(data)の二つ データはおそらく使ってないだろうからイベントハンドラ つまりデータを作る時セルごとにイベントハンドラをつけるのではなく テーブルなど上位の要素に一つだけイベントハンドラをつけるようにすれば良い >>278 とりあえず隠して requestIdleCallback使って少しずつ消していったら? アドバイスありがとうございます 普通は遅くならないということなので、イベントハンドラを意識して見てみたいと思います 「Jquery もういらない」とサジェストされるんですが、まもなく消える技術なんですか? 導入の簡単さ、お手軽さは替えがたい。 まだまだ生きるよ。 ごちゃごちゃイキってんのはエンタープライズ用途の意識高い系で個人や小規模サイトにはまったく関係ない。 >>282 サジェストされないし、 消えることもないよ 「不要」とか「いらない」ならまだしも 「もういらない」がサジェストするとかありえないな そんな言葉で検索したり書いたりしないだろ? 今までに自分が調べた言葉が優先されただけだろ なお「不要」も「いらない」もサジェストされてない シークレットウインドウでGoogleでサジェストされたのは以下 ・ダウンロード ・使い方 ・サンプル ・入門 ・最新 ・できること ・読み込み ・導入 ・javascript ・$ 意味 GIFのローディングアニメを使ってるんですがサーバサイドの処理が終わってブラウザでDOMを作る時にアニメが止まります 止まらないようにする事は出来るでしょうか >>286 requestIdleCallback使って少しずつ作っていったら? Ajaxで配列を受け取るときの書き方を教えて下さい(3.1.1) phpで配列をajaxに返して表示したいのですが、 指定箇所Aでdataをdata.dTextと書いても、受け取れません どう書けばいいですか? ///////index.html/////// $('#ajax').on('click',function(){ $.ajax({ url:'./requestA.php', type:'GET', data:{//phpに渡す 'divText':$('#divTextID').text() } }) // リクエスト成功時、phpから受け取る .done( (data) => { $('.result').html(data);//ココ教えて!!!!!!!!!!!!!!!!!!指定箇所A }) }); ////requestA.php////// header('Content-type: text/plain; charset= UTF-8'); $rs=array( "dText" => $_GET['divText']//ココの値が欲しい!!!!!!!!!!!!!! ); echo json_encode($rs); 自己解決しました 古い書き方ですが受け取れたので一応(1.10.1) jqueryクックブック第2版まだですかね? 初版はもう売ってないようなんですが このゲーム本当に可愛い女の子いっぱいやな https://goo.gl/ux7Y7F $test1 = $('.navigation li a').each(function() { var $href = $(this).attr('href'); return $href; }); こんな風にeachで回してhrefの値だけを取りたいんですが $hrefには文字列でurlが格納されているのですが、$test1ではオブジェクトで返って来てしまってて<a>タグなど全ての要素が含まれてしまうのですがどのようにすれば良いでしょうか? $test1[0] = url1の文字列 $test1[1] = url2の文字列 $test1[2] = url3の文字列 としたいです 以下のどちらか var $links = $('a').map(function() { return this.href; }); var links = $links.get(); もしくは var links = $.map($('a'), function(a) { return a.href; }); 「要素の配列」を同じ数の「別の配列」に変換するときにはmapを使う 前者のjQueryオブジェクトのmapは、一般的にはjQueryオブジェクトを返すためにつかう この例のように文字列を返すこともできなくはないけど。.get()メソッドで値を取得できる (.get()メソッドは一般的にはjQueryオブジェクトからDOM要素を取り出すために使う) 後者は「何かの配列」を「別の何かの配列」に変換する。 これはreturnで返したものが単純に戻り値になる >>298 詳しい解説までありがとうございます mapで'href'の値のみ取得出来るようになりました!!! DOMエレメントにtextメソッドで書き込んだ文字列を textメソッドで読んだ時は 必ず同じ値になりますか? なんとなく、変換されてしまう場合もある気がしますが ある要素の子要素をごっそり入れ替えるのに、 emptyメソッドとappendメソッドを使っていますが 一度に済ませる方法ありますか? >>302 htmlメソッドに文字列以外を渡すという発想がありませんでしたが appendのようにjqueryオブジェクトやjqueryオブジェクトの配列を渡しても動作するんですね ありがとうございました 20年前にも聞いたな… いつまでもおんなじネタで騙され続けるのねw jquery初学者の者だが これ便利ですね なんですたれてるの? 別にすたれてない。 みんな知ってるので誰もわざわざ宣伝しないだけ。 長年連れ添った妻のようなもの。 見えないところで陰口を叩いてるだけで誰も本当に別れようとしない。 ここを見る限り年々増え続けたjQueryのシェアがようやく止まったかなってところだしな https://w3techs.com/technologies/history_overview/javascript_library/all ウェブ全体の73.3%(JavaScriptライブラリを使用している中では97%)で しばらくは安定するのだろう。それからいつ減少に転じるかはわからない 連想配列(idやnameなどが入っています)をJSONで渡してjQuery側へ持ってきた値が取り出せなくて困っています return json.test_data;には正常に連想配列の中身が入っていることを確認したのですが $testからidなど個別に参照したいのですがどのようにすれば良いのでしょうか? $testの中身を見るとObjectのresponseJSON配下に欲しい値が入ってるのでこれを取り出したいです var $test = $.getJSON( "JSONのURL", function(json){ return json.test_data; } ); console.log($test.responseJSON.test_data[0]); ← undefinedとなってしまう $testは名前が良くないだろ。 $なんとかは、jQueryオブジェクトを入れる時の (一部で使われてる)命名規則だ で、$testの中にresponseJSONがあるわけないだろ たぶんtest_dataもないだろ ちゃんと$testの中表示してみてみろ $ で始まる変数名は、付けられない または、使わない $.getJSONは非同期処理なんだからコールバック内か$test.doneで処理しろ $.getJSONして終了待たずにconsole.logしたらjson取ってくる前にconsole.logされちゃうでしょ 皆さん、ありがとうございます JSONを扱う処理は$.getJSON内に処理を書くのが普通なのですね $.getJSONはJSONで渡した値を取得するだけで、取得した後に処理を書くものだと思っていましたw 変数名の$についても分かりました ■ このスレッドは過去ログ倉庫に格納されています
read.cgi ver 07.5.5 2024/06/08 Walang Kapalit ★ | Donguri System Team 5ちゃんねる