+ JavaScript & jQuery 質問用スレッド vol.8 +

1Name_Not_Found2017/11/10(金) 22:44:30.04ID:???
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/

227Name_Not_Found2018/04/10(火) 04:49:15.25ID:???
ページのリダイレクト先について質問です。

<!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を記載すれば宜しいのでしょうか?

228Name_Not_Found2018/04/10(火) 08:54:29.66ID:???
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';

}

229Name_Not_Found2018/04/10(火) 14:16:26.40ID:???
>>226
正常に動く

T.aaa {}
と表示される

230Name_Not_Found2018/05/01(火) 18:31:24.13ID:l1wYHpV1
誰でもできる在宅ワーク儲かる方法
少しでも多くの方の役に立ちたいです
グーグルで検索するといいかも『金持ちになりたい 鎌野介メソッド』

F8AFC

231Name_Not_Found2018/05/01(火) 18:47:22.15ID:qHJ4a40K
>>230
マルチ広告死ね。儲かる言ってる割に宣伝必死だなww
借金で首吊れやwww

232Name_Not_Found2018/05/07(月) 19:11:22.82ID:???
ホームページ例
http://www.kigyo88.com/visa/

このホームページの外国語タブ使われているのは、JavaScriptでしょうか?
それでこのような翻訳機能が出来るやり方が載っている『本』とかありましたら
教えていただけないでしょうか?

233Name_Not_Found2018/05/07(月) 20:43:36.70ID:???
言語が違う全く同じ内容を最初から4つ用意しておいて
表示を切り替えてるだけだから、JSもシンプルだし、別にラジオボタンとCSSでもできる
でも勿論それが銀の弾丸というわけではない

コンテンツがシンプルで量もそれほどない、という前提があって使えることだし、
もしかすると翻訳のことも考えた結果のデザインになっているのかもしれない

つまり何かを実現するための方法というのはその時その時の他の要素で大きく変わるし、
何かを実現しやすくするために別の何かを調整しておかないといけないことも多いので
そんな話は簡単ではないし、勿論本を見て勉強するようなことではないということ
所謂応用力だから

234Name_Not_Found2018/05/07(月) 22:48:59.42ID:???
let a = $('<p>a</p>');
let b = $('<p>b</p>');
$('#hoge').html([a,b]);

このようにhtmlメソッドにjQueryオブジェクトの配列を渡したら問題なく動作しました
何故でしょうか?

235Name_Not_Found2018/05/07(月) 23:22:41.60ID:???
ちなみにもともとはjQueryオブジェクトの配列を要素にappendしていたのを、
追加ではなく入れ替えたいと思ってやってみたら動作したいう次第です

2362322018/05/08(火) 14:07:27.82ID:???
>>233
なるほど、これは翻訳をあらかじめ用意してるだけなんですか。
ありがとうございました。

237Name_Not_Found2018/05/08(火) 16:49:53.76ID:???
>>234
jQueryはよくできているからです。

238Name_Not_Found2018/05/09(水) 07:42:36.88ID:???
>>237
感心ですね
ありがとうございました

239Name_Not_Found2018/05/15(火) 00:47:32.14ID:???
以前はマウスホイールイベントを扱うのにjquery-mousewheelプラグインを使っていましたが
今はjquery自身が実装してるのでしょうか?
mousewheel jqueryでググるとまだjquery-mousewheelがトップに出てきますが、
更新が止まってますし、対象期間を1年以内にすると消えます

240Name_Not_Found2018/05/15(火) 02:50:25.79ID:+y/r9I8H
仕事でIEのブラウザ上を普通にctrl cコピーしてExcelに貼ることが多いんだけど、セル一枠がクレジットカード番号のみ情報が混じってると勝手に16文字目が0にされてしまう
セルに直接クレジットカード番号打ち直せばいいんだけど、いちいち結構な手間になってしまう
特にブラウザのCSSのデザインもExcel上に残したいからなおさら

Excelのフォーマットの文字列に該当する設定ってJavaScriptでできたりする?

241Name_Not_Found2018/05/15(火) 05:45:13.80ID:???
Excel の数値型の精度が、15桁までしかないのかも。
Excelに、文字列型と解釈させれば良いかも

20桁ぐらいある数値を、Excelにコピーして試してみれば?

242Name_Not_Found2018/05/15(火) 07:01:12.29ID:???
>>239
jQueryやそれらの古いライブラリはまだpassiveに対応してないので
現状では実質使えないものとなってるがv4.0で対応予定

https://github.com/jquery/jquery/issues/2871
ここを追うと良い
v4.0までは自分でライブラリ書くと良いよ

243Name_Not_Found2018/05/15(火) 15:25:11.56ID:???
ありがとうございます
passive event listenerっていうのは初耳です

244Name_Not_Found2018/05/15(火) 19:49:07.77ID:???
$(document).on('wheel', function (event){
console.log(event.originalEvent.deltaY);
})

245Name_Not_Found2018/05/16(水) 10:03:45.74ID:HI6BdTWo
初心者質問で申し訳ありません。
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ならこうするでも構いません。どうぞ、よろしくお願いします。

246Name_Not_Found2018/05/17(木) 00:20:04.50ID:???
君は、ラジオボタンの基本から間違っている。
name 属性は同じにしないと、同じグループにならない

まず、HTML のラジオボタンから勉強せよ

「html radio checked」「jquery radio checked」で検索!

【jQuery入門】ラジオボタン(radio要素)の取得・選択・checked操作!
https://www.sejuku.net/blog/46739

247Name_Not_Found2018/05/17(木) 08:36:01.83ID:72MVaTHy
>>246
私の説明が下手だとは思うのですが、
第一希望のラジオグループと、第二希望、第三希望のラジオグループがあって、
それぞれ同じ項目を持っており、一つのラジオグループで選択された項目を
他のラジオグループではdisabledにしたいのです。
全部書かずに省略した"・・・"なのです。

248Name_Not_Found2018/05/17(木) 09:04:28.95ID:???
なんか図かけよ

249Name_Not_Found2018/05/18(金) 00:43:16.48ID:???
jQueryのchange()によるイベント処理操作まとめ!
https://www.sejuku.net/blog/41231

ラジオボタンのchangeイベントで、
一つのラジオグループで選択された項目を、
他のラジオグループではdisabledに設定すれば?

>name="第一希望"
半角文字以外を使うな

250Name_Not_Found2018/05/18(金) 01:04:08.01ID:???
name="dai ichi kibou"

251Name_Not_Found2018/05/18(金) 01:04:24.38ID:???
name="ダイイチキボウ"

252Name_Not_Found2018/05/18(金) 02:05:33.93ID:1EeoIRbM
>>249
そうするために、要素(添え字)の数を知りたいと思っているのですが・・・。
val()で値を取得して、該当するものを探す方法でもいいんですがそれが
わからないので質問しているのです。ご紹介のサイトでは
説明をみつけられませんでした。
(値が同じという前提ではないので、値は使いたくないのですが、
 それでも構いません)

ANK不使用については大前提なのです。

253Name_Not_Found2018/05/18(金) 04:18:41.47ID:???
なにやりたいのさっぱりだっから、これよんで勉強しろ

<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));
});

254Name_Not_Found2018/05/18(金) 09:27:15.60ID:???
<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

255Name_Not_Found2018/05/18(金) 09:35:54.27ID:???
nth-childやeq使ったり、data属性でグループ化したらいいんじゃにの

256245, 247, 2522018/05/18(金) 12:55:34.40ID:1EeoIRbM
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の場合が続く

}

2572562018/05/18(金) 12:58:52.07ID:1EeoIRbM
連投すみません。
>>253
つたない説明で申し訳ない。
nameが日本語で、文字コードはShift-JISなのですが、動きますか?
さくっと書いたものでは動作しませんでした。
他の書いた部分が違ったのかもしれませんけれど。

2582562018/05/18(金) 13:09:14.12ID:1EeoIRbM
>>254
コードをありがとう。value値で引っ張るのですね。日本語通るか試してみます。
※ただ、選択肢が増えたり変更した場合にJavascriptを書き換えないといけないのと
正直、例えば20位の選択肢の第3希望までを、ifなりswitchなりで分岐するのはいかがなものかと。

>>255
正しくないのですが、(さくっと書いたら動かなかった)
var i = $(".kibo01:checkd).index();//そもそもindex()が正しいのかわからない
$(".kibo02:eq(+i+)").attr("disabled", true);
とかしたいのです。
どのように書いたらいいんでしょうか。
nth-childやdata属性は使ったことがないので調べてみます。

みなさん、ありがとう。

259Name_Not_Found2018/05/19(土) 01:22:46.92ID:???
文字コードは、BOM なしUTF-8 以外は、使わないように

プログラミングの基本は、半角文字だけ。
全角文字などは、テキスト部分だけに使うように

HTML, jQueryの基礎から勉強して、わからない事は検索するように

素のJavaScript で、プログラミングしないように
>256 のようなループ処理を読むのが面倒だから

選択肢の数が変動するなら、汎用的に作らないといけないから、
簡単にプログラミングできない

>254 のような、radio_1 と、radio_2 の対応表が必要

2602562018/05/20(日) 22:35:12.69ID:???
>>259
酔っ払ってる?
気を悪くしたら申し訳ないのですが、
たぶん私の方が貴方より諸々理解していると思います。
回答しようとしてくれる気持ちはありがたいです。本当に。
土日は所用があり試せていませんが、ちょっと思いついたこともあります。
また試してみたく思います。ありがとうございました。

261Name_Not_Found2018/05/21(月) 03:54:49.18ID:yAEwsLRn
Jqueryのajaxで他のhtmlファイルを読み込んでそいつをgetElementByIdとかで
DOM操作してやりたいのですがやり方が分かりません。
XMLHttpRequestでゴリゴリ行くならばresponseTypeにdocumentを指定してやれば
responseXMLをそのまま使えるのですがJqueryではどうすればいいでしょうか?

262Name_Not_Found2018/05/21(月) 04:08:17.20ID:???
普通にやればできる
かなり簡単

263Name_Not_Found2018/05/21(月) 05:07:07.67ID:yAEwsLRn
$.ajax({
type: "POST",
url: "/hoehoe.php" ,
data: {
key: "ほえほえ"
},
dataType: "html",
timeout: 10000
}).done(function(html) {
console.log($(html)[0].getElementById('xxx'))

});
});

普通に考えてこんな感じでやってみたりしてるんですが上手く行かず
末端の方だと$(html).find("#xxx")で取れなくもないのですが
ルートの上の方で子要素が沢山ある場合失敗するような感じ

264Name_Not_Found2018/05/21(月) 05:27:25.84ID:yAEwsLRn
自己レス、分かりました。
findで絞る場合、body直下のタグはダメなんですね。

265Name_Not_Found2018/05/21(月) 05:37:02.39ID:???
>>264
HTML入門とかいう本を読んだほうが良い

266Name_Not_Found2018/05/21(月) 05:48:42.98ID:yAEwsLRn
と思ったけどもbody直下以外にも取得できなかったりしてダメだな。何が悪いんだろう。

267Name_Not_Found2018/05/21(月) 11:40:58.93ID:???
他のHTML ファイルを読み込むって、他のドメインからは、
Cross-Origin Resource Sharing (CORS) で読み込めないだろ

例えば、自分のwebページから、
5ch のHTML を、iframe 内に読み込んでも、
他のドメインのwebページだから、アクセスできない

だから、ブラウザから直接では、アクセスできないので、
自分のPC に、webサーバーを立てて、そこ経由でアクセスしないといけない

Ruby の標準サーバー、WEBrick とかを立てる

268Name_Not_Found2018/05/21(月) 12:34:29.64ID:???
Nodeで2,30行書いた方が良くない?

269Name_Not_Found2018/05/21(月) 12:39:59.86ID:???
こいつruby宣伝クソ野郎だから。

2702562018/05/21(月) 12:58:15.19ID:???
>>263
・htmlを画面表示していますか?
 表示しないと(console表示だけだと)documentの関数は使えないと思います。
・表示したのであれば、単純に("#xxx")で取得できると思います。
 あえてgetElementByIdを使う理由があるのでしょうか。

2712562018/05/21(月) 13:01:15.07ID:???
ごめんなさい。
ここでいうhtmlというのは"hoehoe.php"で作られるファイルのことです。

272Name_Not_Found2018/05/21(月) 18:41:46.87ID:yAEwsLRn
>>266
更に自己レス、単純にpostで得られるドキュメントがエラー吐いてて
想定の形式じゃなかったからこっちもエラー吐いてただけの模様。
寝ないで作業するととこんな単純なことも見逃す脳みそになってしまうという言い訳。
ただ、それだけじゃ説明できないことも有るような気が戦でもないけどとりあえずちゃんと動いてるので検証はしない。
多分気のせい。そうに違いない(願望

>>270
あえて使わない理由は特に無いですが
普段jqueryは使わないのとgetElement系も自前でワッパー定義してて
実際は$i("id")とかでもっと短く書けてるのでこっちのが便利なんです

273Name_Not_Found2018/05/21(月) 18:57:29.60ID:???
ワッパ?逮捕?

274Name_Not_Found2018/05/21(月) 19:40:36.57ID:???
>>272
解決おめでとうございます。お疲れ様です。
アルト、エネーブル、ブーリーンという人は知っていますが
ワッパーは初めてです。

275Name_Not_Found2018/05/21(月) 20:07:25.96ID:???
ゥラッパーって必ず小さいウ入れてくる奴はいた。吹き出さないよう必死だった俺。

276Name_Not_Found2018/05/21(月) 21:55:33.96ID:???
オレオレワッパー

277Name_Not_Found2018/05/21(月) 23:38:37.62ID:N1KmZ/qF
ラッパーですか?

新着レスの表示
レスを投稿する