16/06/24 15:42:06.83 .net
■参考リンク
・jQueryトップページ
URLﾘﾝｸ(jquery.com)
・ダウンロード、CDN
URLﾘﾝｸ(jquery.com)
・ブラウザサポート
URLﾘﾝｸ(jquery.com)
・jQuery UI
URLﾘﾝｸ(jqueryui.com)
・jQuery UI ダウンロ－ド
URLﾘﾝｸ(jqueryui.com)
・リファレンス等
URLﾘﾝｸ(js.studio-kingdom.com)
URLﾘﾝｸ(alphasis.info) (URLﾘﾝｸ(alphasis.info))
URLﾘﾝｸ(www.jquerystudy.info)
■諸注意
過去スレはjQuery信者がjQuery布教の為にライブラリ総合質問所を乗っ取るためにたてたスレです。
その為、荒らしが常駐していますが、基本的に煽りはスルーしましょう。
3:Name_Not_Found
16/07/07 03:53:16.90 ThEb4ViG.net
最近javaScriptを独学で学んでいる者です
複数のul要素(同クラス名)の、子要素liの2番目に .before() でli要素を追加したいのですが、
var li = $('<li>').text('text');
$(ul.test > li:eq(1)).before(li);
では:eq(1)のせいか最初のulの子要素にしか反映されませんでした。
このような場合はどのようにすれば全ての同class名のulに反映されるのでしょうか？
4:Name_Not_Found
16/07/08 01:06:15.26 .net
jQueryは、最初の1つしか取り出せない。
複数は取り出せないから、
ul.test1
ul.test2
など、異なるクラスを、割り当てればいい
5:Name_Not_Found
16/07/08 02:07:35.37 .net
>>3
これでできるよ。
var li = $('<li>').text('text');
$('ul.test > li:nth-of-type(2)').before(li);
あとウソを付くやつがいるから気をつけてなｗ
jQueryは複数の要素に適用することができる。
メソッドの効果（今回で言えばbefore）は複数の要素に適用される。
値を返すメソッドに限り最初の要素の値のみを返す。
6:Name_Not_Found
16/07/09 01:22:13.29 .net
$(ul.test > li:eq(1)).before(li);
$('ul.test > li:nth-of-type(2)').before(li);
同じ構文なのに、上は1つで、下は複数になるのか？ なぜ？
7:Name_Not_Found
16/07/09 02:30:31.18 .net
>>6
同じじゃないじゃんｗ
eqとnth-of-typeは意味が違うってだけ
8:Name_Not_Found
16/07/12 20:39:32.36 .net
.fooが後述するh2要素をjQuery()で取得するのはどのように書けばいいでしょうか
<h2>hoge</h2>
<p class="foo">foo</p>
<h2>hoge</h2>
<p class="foo">foo</p>
<h2>hoge</h2>
<p class="piyo">piyo</p>
9:Name_Not_Found
16/07/12 23:23:19.74 .net
>>8
これでいい？
$(".foo").prev('h2').css('color', 'red');
以下の場合上2つのh2が赤になる。
<h2>hoge</h2>
<p class="foo">foo</p>
<h2>hoge</h2>
<p class="foo">foo</p>
<h2>hoge</h2>
<p class="piyo">piyo</p>
<h3>hage</h3>
<p class="foo">hage-foo</p>
<h2>hoge</h2>
<h3>hage</h3>
<p class="foo">hoge-hage-foo</p>
10:Name_Not_Found
16/07/13 02:17:45.15 .net
>>9
一つのセレクタで割り出すことは不可能ですか？
11:8
16/07/13 13:04:17.68 .net
自己解決しました
URLﾘﾝｸ(jsfiddle.net)
12:Name_Not_Found
16/07/13 13:47:38.14 .net
セレクタにおける :nth-of-type(), :nth-child(), :eq() の違いを教えてください
13:Name_Not_Found
16/07/13 22:55:38.61 .net
>>12
サンプルでも作って調べればわかるんじゃねーの？
nth-of-type と nth-child は単なるCSSセレクタなんだから
こことか見れば書いてあるだろ
URLﾘﾝｸ(developer.mozilla.org)
14:Name_Not_Found
16/07/14 00:38:42.40 .net
>>13
検証してもわからないから質問しているのですが
:eq()に触れてないのはなぜですか？
15:Name_Not_Found
16/07/14 01:07:31.32 .net
>>14
:eqはCSSセレクタじゃないからなだけだけど？
まずnth-of-typeとnth-childの違いを言ってみ
読むべきページは出したよね？
16:Name_Not_Found
16/07/14 01:53:35.83 .net
>>15
セレクタの:eq()を知らないんですね
URLﾘﾝｸ(api.jquery.com)
17:Name_Not_Found
16/07/14 02:03:35.50 .net
>>16
英語は読めるかい？
Because :eq() is a jQuery extension and not part of the CSS specification,
18:Name_Not_Found
16/07/14 08:26:10.58 .net
>>17
jQuery拡張でも使えれば問題にしてないんですが
19:Name_Not_Found
16/07/14 22:26:19.22 .net
>>18
>>13で:eq()に触れてないのはCSSセレクタじゃないから
だって話なんですが？
20:Name_Not_Found
16/07/15 07:49:44.51 .net
>>19
CSSセレクタでないと都合が悪いのですか？
21:Name_Not_Found
16/07/15 08:46:37.92 .net
>>12
- :nth-of-type() … 同じ要素タイプのグループ内におけるn番目の要素(インデックスは1から始まる)
- :nth-child() … 全要素におけるn番目の要素(インデックスは1から始まる)
- :eq() … 全要素におけるn番目の要素(インデックスは0から始まる)
22:Name_Not_Found
16/07/15 09:00:03.49 .net
>>20
CSSセレクタじゃないとMDNに説明があるわけ無いだろｗ
23:Name_Not_Found
16/07/15 13:48:35.74 .net
>>21
ありがとうございました
>>22
MDNに載っている内容で質問しているわけではありません
質問文をよく読まれてはいかがでしょうか
24:Name_Not_Found
16/07/15 23:20:27.18 .net
>>23
だからMDNに説明書いてあるんだから
読めって話だ。
25:Name_Not_Found
16/07/16 06:50:11.08 .net
まとめ「俺はMDNに書いてある事しか回答できません。:eqなんて知りません。」
26:Name_Not_Found
16/07/16 14:23:18.58 .net
MDNの回答すら見なかったくせにｗ
27:Name_Not_Found
16/07/16 14:49:20.44 .net
どえでもいいけど、>>14からの流れはMDNではぐらかしているようにしか見えないんだよな
28:Name_Not_Found
16/07/16 15:01:47.93 .net
jQueryにelement.classList相当のAPIはありますか
classトークンを配列で得るAPIを求めています
29:Name_Not_Found
16/07/16 15:20:02.75 .net
>>28
普通にclassNameをスペースで区切ればいいだけだけど？
そもそもclassListっていうのはclassNameに書かれた
スペースで区切られた複数のクラスのうち特定のものだけ抽出したり
変更して再設定するのが面倒だから追加された機能なんだけど。
おそらくクラスの使い方を間違ってると思うよ。
それhasClass()とかでもっと効率的に書ける問題でしょ？
30:Name_Not_Found
16/07/16 18:30:08.59 .net
>>29
hasClass, removeClass, toggleClassは全て知っています
そんなに多くはないのですが、classトークンを配列で欲しい状況があります
31:Name_Not_Found
16/07/16 18:33:03.98 .net
element.className.split(' ')しかないのなら残念です
classListの代替機能がjQueryにあることを期待していたのですが
32:Name_Not_Found
16/07/16 19:19:59.07 .net
classListはIE9では使えないからな
俺もjQueryにあるなら使いたいわ
33:Name_Not_Found
16/07/16 19:33:15.62 .net
俺がライブラリの開発者なら、
element.className.split(' ') で済むものを
$(element).classNames() なんてメソッド作ろうと思わないな。
それはそれとして、どういうときに使いたくなるの？
34:Name_Not_Found
16/07/16 20:19:12.45 .net
まずはあるかないかを答えてやればいいのに目的を聞いてくるあたり、jQueryに不利な情報は出したくない感が見えるな
少なくとも俺の知る限りではないんんだが
35:Name_Not_Found
16/07/16 21:00:14.56 .net
そうやって使う目的をいわないでjQuery批判に
持っていこうとしている所がわざとらしいよなｗ
最初からそれが狙いみたいな。
それがバレバレだから使う目的を聞かれてるんだよ。
36:Name_Not_Found
16/07/16 22:01:04.30 .net
具体的にはclassトークン文字列を直接操作する場合に必要になります
例えば、下記では 1,2,3 の数値を参照することを求めます。
<p class="hoge-1">hoge</p>
<p class="hoge-2">hoge</p>
<p class="hoge-3">hoge</p>
「data-*属性で数値を分離すればいい」とする対案もあるでしょうが、
<p class="hoge" data-hoge="1">hoge</p>
<p class="hoge" data-hoge="2">hoge</p>
<p class="hoge" data-hoge="3">hoge</p>
既存コードを改修する場合に改修個所が多くてHTMLを書き換えるのが現実的ではないケースがあります
「何が最善か」は時と場合によります
「全てにおいて～が最善」という事がなければ「は～という理由で絶対に使わない」という事もないと私は考えています
バッドノウハウと他人に評価されようが、使えるカードは出来るだけ取っておくのが私の流儀です
その為には使えるカード(jQueryにclassListがあるのか)を予め知っておく必要があります
37:Name_Not_Found
16/07/16 22:05:38.54 .net
「これこれこういう理由でclassListは使わない」なアドバイスは有り難く頂戴しますが、それはそれとしてclassListの有無は答えて頂きたいのが正直な気持ちです
今、必要なのは「事実」であって「意見」ではありません
「使う/使わない」は各自が自由に決めればいい事であって他人に押し付けるものではない、と私は思います
38:Name_Not_Found
16/07/16 22:14:12.11 .net
> それはそれとしてclassListの有無は答えて頂きたいのが正直な気持ちです
うん。だからelement.className.split(' ')で取れるよって
39:Name_Not_Found
16/07/16 22:16:48.75 .net
なんでJavaScriptでも手間変わらずに同じことをやれるのに
jQueryにそれを求めるのだろうか？
jQuery.eachとかは古いブラウザでは搭載してなかったから
という理由で入ったんだぞ。手間変わらずに同じことができるなら
jQueryを使わなくていいんだよ。
jQueryはDOM操作を関数型風に使うためのライブラリなんだから。
40:Name_Not_Found
16/07/16 22:47:38.93 .net
>>36
意味がわからん。っていうか答えになってない。
その話だけなら、$('p').attr('class') とかでいいだろ。
classList相当のものを探していたんじゃないのか？
classListを使っても hoge-1 とかしか取得できない。
1, 2, 3 という数値を取ることはできない。
41:Name_Not_Found
16/07/16 22:55:04.10 .net
もしかしてattrでclassを取得できるっていうのが分かってないとかだろうかね？
例えばこんなことだってできる。
$('p[class^="hoge-"]').attr('class', function() {
return this.className.replace('hoge', 'hage');
});
この答えで100%問題ないだろ？w
って言ったら駄目だっていうんだろうな。
だからなんに使うのかを聞いてるのに。
42:Name_Not_Found
16/07/16 23:00:26.59 .net
>>36
> 例えば、下記では 1,2,3 の数値を参照することを求めます。
>
> <p class="hoge-1">hoge</p>
> <p class="hoge-2">hoge</p>
> <p class="hoge-3">hoge</p>
classって複数指定できるの知ってる？
<p class="hoge-1 hoge-2">hoge</p>
って書いてあったらどするの？
1,2,3 の数値を参照ってどういうこと？
43:Name_Not_Found
16/07/16 23:06:30.58 .net
>>36
> その為には使えるカード(jQueryにclassListがあるのか)を予め知っておく必要があります
あ、つまり、今すぐにどういうことに使おうか思いつかないが
機能を知りたいだけねｗ
ならあるっていうのが答え。
できた時代から考えてjQueryを参考にしてclassListを作ったようなものだから。
URLﾘﾝｸ(api.jquery.com)
classList.add → .addClass()
classList.remove → .removeClass()
classList.toggle → .toggleClass()
classList.contains → .hasClass()
更に値としてコールバック関数が使えるなどjQueryオブジェクト（DOM要素コレクション）を
操作しやすく拡張されている。
44:28
16/07/18 12:42:52.75 nUYW4FuR.net
「jQueryにはない」という意見しか出ないですね
残念ですが、自前で拡張する事にします
回答を下さった方、ありがとうございました
45:Name_Not_Found
16/07/18 13:09:50.70 .net
必死だなｗ あるって話をしてるのに。
46:Name_Not_Found
16/07/18 14:19:17.12 .net
ごめん
教えてほしいことがあります。
URLﾘﾝｸ(www.dotup.org)
↑サイトが開かれるのと同時に開く確認ダイアログの中に、アフィリエイト広告を張り付けたいんだけど、どうやればいい？
それとも、仕組み上無理なの？
コード自体は、web上で公開されてるヤツで、いろいろいじってみてるんだけど、初心者にはよくわからん……
↓どこをどういじればいいの？
URLﾘﾝｸ(www.dotup.org)
47:Name_Not_Found
16/07/18 14:35:24.47 .net
>>46
jQueryと関係ないのでこっちにどうぞ
+ JavaScript の質問用スレッド vol.130 + [無断転載禁止]©2ch.net
ｽﾚﾘﾝｸ(hp板)
48:Name_Not_Found
16/07/18 14:51:11.20 .net
すみません、スレ違いでしたか……
丁寧に誘導までしていただきありがとうございます
49:Name_Not_Found
16/07/26 18:42:47.32 .net
あるinputが、TYPEが radio か text かを判定したいんだけど
なにで区別すればいいですか？
50:Name_Not_Found
16/07/26 19:18:38.57 .net
>>49
typeだと思う
51:Name_Not_Found
16/07/26 21:08:32.17 .net
>>49
どこで区別するのかによる。
$('input:radio') 要素を選択するならこれ
イベントハンドラで使いたいならば
$(document).on(イベント, 'input:radio', function() {・・・})
というのもあり。
俺はあまりやることはないが、どうしてもイベントハンドラの中で区別したいなら
$( "input" ).on('change', function() {
if ($(this).is( ":radio" ) ) {
・・・
}
});
とかいうのもありだろうし、isの代わりにthis.type === 'radio' でもいいかもしれない。
52:Name_Not_Found
16/07/27 15:11:49.28 .net
>>50-51
ありがとう。 $unko.attr('type') == 'radio' でできた
53:Name_Not_Found
16/07/27 19:10:13.40 .net
2chでたまにある下品な変数名って何なの？
自分が下劣な人間であることをアピールしてるの？
54:Name_Not_Found
16/07/27 19:31:28.35 .net
痛車に乗っている奴と同じで周囲と自分の感覚のズレに気が付いてないだけだろ
本人は面白いネタを披露しているつもりなのさ
小学生があの単語を連呼して喜んでいるのと同じ
55:Name_Not_Found
16/07/27 20:08:08.93 .net
unko はラテン語で「ひとつの」を意味する単語だし
メタ構文変数としては適切だと思うよ
56:Name_Not_Found
16/07/27 20:35:47.05 .net
意味がある時点でメタ構文変数ではないんだが
URLﾘﾝｸ(ja.wikipedia.org)
57:Name_Not_Found
16/07/27 20:51:30.26 .net
というか、日本語で読めるものを外国語で読む論理なら「nihon は英語では読めないからメタ構文変数」と主張できることになるんだが、明らかにおかしいだろ
58:Name_Not_Found
16/08/08 04:34:25.33 .net
>>5
ものすごく遅くなりましたがみなさん回答ありがとうございました。
助かりました。
59:Name_Not_Found
16/08/14 20:45:14.39 .net
<form action="hoge.php">
<input type="submit" id="send" value="送信">
</form>
$('#send').click(function(){
if (条件) {
（処理）
} else {
return false;
}
});
と、送信でも条件によってフックしてhoge.phpへの移行を
阻止したいのですがこれってどのブラウザでもその通りになりますか？
phpが先に実行される可能性はありますか？
60:Name_Not_Found
16/08/14 22:24:15.04 .net
>>59
DOMを正しく実装しているブラウザであれば期待通りに動きます。
それはそれとして、対象ブラウザ全てで検証するのは基本だと思うのですが。
61:Name_Not_Found
16/08/14 22:41:36.14 .net
>>60
ありがとう。
この方が早いかと一瞬思ったのですが、後々考えたら
普通のボタンにonclickでfunction呼び出した方が見通しがいいかもしれませんね。
私の場合他人が見ることもHTMLだけ見ることもないので
さほどの問題でもないのですが（たぶん）。
62:Name_Not_Found
16/08/15 00:09:53.91 .net
>>61
> 普通のボタンにonclickでfunction呼び出した方が見通しがいいかもしれませんね。
今はonclick属性は一般的に使わない。
あとreturn falseではなく、event.preventDefault()を使うのが標準的なやり方だ。
eventはclickのイベントハンドラの第一引数な。
それからその場合はformのsubmitイベントを捉えたほうが良い。
そうすればthisがformになるからformの中を参照するのが少し楽になる。
ついでだが#sendにイベントハンドラをつけるのではなくdocumentにつけて
#sendで振り分けたほうが良い。僅かなタイミングだが
イベントハンドラが有効にならない期間がある。
要するにこうした方がいいという話だ。
<script>
$(document).on('submit', '#sendform', function(event) {
if (!条件) {
event.preventDefault();
return;
}
処理
});
</script>
<form id="sendform" action="hoge.php">
<input type="submit" value="送信">
</form>
63:Name_Not_Found
16/08/15 22:41:59.07 .net
>>62
＞event.preventDefault()を使うのが標準的なやり方
これだと何がいいのでしょうか？
イベントの伝播で安全ということでしょうか？
64:Name_Not_Found
16/08/21 12:29:01.33 .net
>>63
バブリングを止めない、という理解でいいんじゃないか
65:Name_Not_Found
16/10/23 12:58:24.02 k3QeH1kd.net
jqueryプラグインの「mix it up」を使っていて、
さらにプラグイン「jquery.cookie.js」を使ってそれをクッキーに保存させたいと思っています。
`
sample.html
<div class="style1">
<div>
<div class="filter style2" data-filter=".a">青</div>
<div class="filter style2" data-filter=".b">赤</div>
<div class="filter style2" data-filter=".c">黄</div>
</div>
</div>
<dl>
<dd class="sort" data-sort="default">新着順</dd>
<dd class="sort" data-sort="myorder:desc">価格の高い順</dd>
<dd class="sort" data-sort="myorder:asc">価格の低い順</dd>
<dd class="sort" data-sort="random">ランダム</dd>
</dl>
<div class="style3">
<div class="mix a">青</div>
<div class="mix b">赤</div>
<div class="mix c">黄</div>
</div>
`
66:Name_Not_Found
16/10/23 12:58:58.10 k3QeH1kd.net
`
sample.js
$('.style3').mixItUp({
controls: {
toggleFilterButtons: true,
toggleLogic: 'and',
},
animation: {
duration: 0,
},
});
$('.style2').on('click', function(){
$(this).toggleClass('style2b');
});
`
.style2のタグをクリックすると.style3の記事が絞り込み検索される仕組みです。
.style2をクリックすると同時に.style2bが付与され色が反転し、どのタグが選択されているか目視できるようにしています。
.mixにはdisplay:none;がかかっています。
このクッキーを保存して、ページが更新された場合に絞り込み検索および付与された.style2bが残っている状態にしたいと考えております。
独学で作成していて壁にぶつかっております。どうかご教授お願い申し上げます。
67:Name_Not_Found
16/10/23 23:32:21.63 .net
クッキーに、ページの状態を保存したいの？
絞り込み検索のキーワード・カテゴリ、
style2bが付与されたことを、保存すれば？
68:Name_Not_Found
16/10/24 09:18:37.53 MXxfOYJU.net
>>67
そうです。
具体的なコードの書き方を教えていただきたいです。
69:Name_Not_Found
16/10/25 01:09:11.78 .net
クッキーの仕様・容量を、調べれば？
データ構造は、[キー : 値] の辞書かな？
70:Name_Not_Found
16/10/25 12:00:22.97 AcPzGlnV.net
>>69
いろいろと調べてもわからなくてここにたどり着きました。
71:ぐらさんもはらもくろいざんねんうじゃうじゃ
16/10/25 13:19:06.41 .net
ミ～サビ♪ シ ビア
72:Name_Not_Found
16/10/25 23:14:10.11 .net
document.cookie - MDN
URLﾘﾝｸ(developer.mozilla.org)
「jquery cookie」で検索すると、jQueryでクッキーを扱える、プラグインが一杯ある
73:Name_Not_Found
16/10/26 02:26:05.03 .net
クッキーはjQueryで扱うべきものじゃない。
なぜならクッキーはDOMとは無関係だから。
それはjQueryが流行って質の悪いjQueryプラグインが大量に
生産されたときの負の遺産。いまどき使うべきじゃない。
「javascript cookie library」でぐぐったらコレが出てきた。
URLﾘﾝｸ(github.com)
starも多いしこれでいいんじゃね？
74:Name_Not_Found
16/10/26 02:28:09.49 .net
クッキーを扱うjQueryプラグインはjQueryプラグインではなくて
jQueryの名前空間に寄生しているだけ。
75:Name_Not_Found
16/10/27 01:20:47.53 .net
そもそも、今でもクッキーを使うのかな？
今は、WebStorage じゃないの？
76:Name_Not_Found
16/10/27 12:41:11.64 .net
>>75
使うに決まってんだろ脳みそ沸いてんのかクソボケ野郎が
77:Name_Not_Found
16/10/28 14:26:24.09 .net
<div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
</div>
例えばdivのclickイベントで、3がクリックされたときに
その次の4のdivを取得する方法を教えてください。
78:Name_Not_Found
16/10/28 14:46:22.99 .net
>>77
event.target.nextElementSibling
79:Name_Not_Found
16/10/28 14:54:33.50 .net
>>78
すみません、JQだとどうなりますか？
80:Name_Not_Found
16/10/28 16:34:29.55 .net
$(this).next()
81:Name_Not_Found
16/10/28 19:21:48.82 .net
>>79
jQueryでも同じコードを書けるんだが
jQuery#nextとnextElementSiblingは同じ
thisとevent.targetは等価ではない
eventは両方とも同じ
82:Name_Not_Found
16/10/28 20:14:35.74 .net
>>80
ありがとうございました。
83:Name_Not_Found
16/10/28 21:46:53.73 .net
>>81
> jQuery#nextとnextElementSiblingは同じ
同じではないよ。
jQueryの基本的な考え方として0個以上の要素郡に対して処理を実行するという点がある。
これの何が便利かというと動的なページであれば何かの要素が存在しない場合がある。
例えばデータが1ページに収まれば「次へ」ボタンを表示しないとか。
document.getElementById('next')なんて書いているとボタンがなかった
ときにnullになって、それを防ぐためにif文が必要になったりするが、
jQueryの場合は、何も書かずとも#nextが見つからなくても問題ない動きをする。
>>77の場合は5がクリックされた時が問題。nextElementSiblingを使うと要素が
見つからない時nullを返すので、そうならないように条件分岐が必要になる。
大したことじゃないと思うかもしれないが、ifの条件を満たす時と満たさない時で
テストが必要になる。言い換えるとコードが複雑になってる。
> eventは両方とも同じ
違う。jQueryのeventは標準仕様に準拠しつつブラウザ間の互換性を高くしている。
jQueryのeventは改良されたevent
84:Name_Not_Found
16/10/28 22:35:39.02 .net
function func1() {
return { 'year': 2016, 'month': 10 };
}
こういう関数を使って値を取り出す場合には、一旦objと言う変数に入れて、
var obj = func1();
var year = obj['year'];
var month = obj['month'];
とするのが普通だと思うのですが、もしobjを使わずに
var year = func1()['year'];
var month = func1()['month'];
とするとfunc1()が二回実行されて無駄ですよね？
質問は、一時変数objを使わずに、かつfunc1()も一回だけ実行して
値をyearとmonthに取り出す方法はありますか？
目的は、単なる興味です。
85:Name_Not_Found
16/10/28 23:07:50.54 .net
jQueryの話と関係ないな
あらしかな。
86:Name_Not_Found
16/10/29 05:09:40.68 .net
YouTubeのサイトのように、画面に表示されている所の、画像だけを表示して、
下へスクロールすると、新たに表示された所の画像を、その時に読み込んで表示するのは、
どのように、やっているのでしょうか？
つまり、非同期・遅延読み込み
87:Name_Not_Found
16/10/29 08:57:58.22 .net
>>84
コードの書き方がいろいろおかしい
同じオブジェクトを参照するなら function func1() {
return { 'year': 2016, 'month': 10 };
}
が不要
year, month も一時変数なので不要
var obj = { 'year': 2016, 'month': 10 };
これだけで良い
これ以上はJSスレで
88:Name_Not_Found
16/11/03 08:04:31.06 FerPc7S6.net
質問お願いします。
スライドショーの上に常に違う画像を重ねて表示させたく
URLﾘﾝｸ(allabout.co.jp)
を参考にしてスライドショーはできたのですが
上に画像を重ねる方法がわかりませんでした。
知恵袋で似てる質問はあったのでチャレンジしてみたのですが
上記のサイトとは違うコードの組み方のようで結局出来ずに終わりました。
ほとんど調べながらコピペしてる状態の初心者なので、初歩的な質問かもしれませんが
もしご存じの方がいらっしゃいましたら教えていただきたいです。
また、解説してるサイト等ありましたら貼っていただけると助かります。
よろしくお願いします。
89:Name_Not_Found
16/11/03 08:18:25.97 .net
>>88
現行スレはこちら
+ JavaScript & jQuery 質問用スレッド vol.6 + [無断転載禁止]©2ch.net
ｽﾚﾘﾝｸ(hp板)
90:Name_Not_Found
16/11/03 08:31:12.68 .net
91:ef="../test/read.cgi/hp/1466750494/89" rel="noopener noreferrer" target="_blank">>>89 ありがとうございます。 そちらで質問させていただきます。
92:Name_Not_Found
16/11/19 13:37:08.41 .net
バージョン1系から3系に入れ替えたら、IE11でローカルファイルを開くとAjaxが動かなくなったけど、
どうすれば良いの？サーバに入れると正常に動作するのに。
93:Name_Not_Found
16/11/19 18:38:14.52 .net
>>91
現行スレはこちら
+ JavaScript & jQuery 質問用スレッド vol.6 + [無断転載禁止]©2ch.net
ｽﾚﾘﾝｸ(hp板)
94:Name_Not_Found
16/11/26 23:19:51.36 .net
画像の遅延ロードってlazyloadでしか無理なの？
95:Name_Not_Found
16/11/28 13:30:55.11 .net
>>93
同等の機能を自分で実装すればいけるよ
昔は自分でやってたもんだ
96:Name_Not_Found
16/12/18 12:27:31.41 .net
現行スレはこちら。
■jQueryスレ
jQuery 質問スレッド vol.7
ｽﾚﾘﾝｸ(hp板)
■ライブラリスレ
JavaScript ライブラリ総合質問所 vol.5
ｽﾚﾘﾝｸ(hp板)
■JavaScriptスレ
JavaScript の質問用スレッド vol.131
ｽﾚﾘﾝｸ(hp板)
JavaScript の質問用スレッド vol.122
ｽﾚﾘﾝｸ(tech板)
JavaScript(ECMAScript)質問用スレッド vol.122
ｽﾚﾘﾝｸ(tech板)
97:Name_Not_Found
17/06/04 20:49:35.14 .net
jQuery初心者ですが、サイト内で複数のmp3を順に自動再生させたいのですが、
ぐぐって出てきたページに
↓このようなコードがあり、ページ中のボタンを押すと再生が始まる仕組みになっているのですが、
ボタンを押さなくてもページが表示された時点で自動再生されるようにするには一体どうすればいいのでしょうか？
～冒頭省略～
$( "#button_play_all" ).click( function () {
var mySources = $( "#media_player" ).children( "source" );
var myAudioPlayer = document.getElementById( "media_player" );
myAudioPlayer.addEventListener( "ended", function () {
～以下省略～～
98:Name_Not_Found
17/06/04 20:51:23.04 .net
>>96 続き・・
<!-- 再生開始ボタン -->
<input id="button_play_all" type="button" value="全ファイル連続で再生" />
<!-- mp3を用意する(HTML5タグ) -->
<audio hidden name="media" preload="auto" id="media_player">
<source src="mp3のファイルパス" type="audio/mp3">
<source src="mp3のファイルパス" type="audio/mp3">
</audio>
ぐぐって出てきたページ↓
URLﾘﾝｸ(lightz.info)
99:Name_Not_Found
17/06/04 23:44:29.83 .net
>>96
autoplay 属性というのがある
<audio autoplay …
ただし、ブラウザ設定でブロックされている場合はどうやっても無理だろう（ユーザに強制できない）
100:Name_Not_Found
17/06/05 00:04:54.08 .net
>>98
ありがとうございます。
1ファイルなら簡単に再生できるのですが、複数のファイルを順に再生する方法がわかりません。
サンプルコードではそこが実現できているのですがページ内のボタンをクリックする必要があります。
$( "#button_play_all" ).click( function () {
↑この部分がボタンクリックで実行する制御をおこなっているようですが
ここを省略して以下のコードを実行させるように書く方法がわかりません。
101:Name_Not_Found
17/06/05 02:36:34.55 .net
>>99
autoplay で再生が始まったときのイベントを捕まえて
そのサンプルコードと似たコードを走らす必要があるだろうね
102:Name_Not_Found
17/06/20 15:56:57.75 .net
まさにこれ
ｽﾚﾘﾝｸ(news板:16番)
ライブラリをネットで探して組み立てるだけ
楽なんだよな
103:Name_Not_Found
17/12/12 04:01:58.71 MrUcGD8N.net
HPで友達が稼げるようになった情報とか
⇒ URLﾘﾝｸ(asaswq3wq.sblo.jp)
興味がある人だけ見てください。
TQZPQYA2JW
104:Name_Not_Found
18/02/18 20:15:41.37 .net
☆ 日本の、改憲を行いましょう。現在、衆議員と参議院の
両院で、改憲議員が３分の２を超えております。
『憲法改正国民投票法』、でググってみてください。国会の発議は
すでに可能です。平和は勝ち取るものです。お願い致します。☆☆
105:Name_Not_Found
18/05/01 22:12:18.40 l1wYHpV1.net
誰でもできる在宅ワーク儲かる方法
少しでも多くの方の役に立ちたいです
グーグルで検索するといいかも『金持ちになりたい 鎌野介メソッド』
5OKLJ
106:Name_Not_Found
18/05/05 17:42:19.13 .net
let $div = $('<div>')..append('<span>')
としてからspanにclassを追加したい場合はどうやればいいですか？
107:Name_Not_Found
19/02/23 19:36:35.09 .net
x = (x === 0) ? y : x++;
この書き方間違ってますか？
ifに書き換えたら普通に動くのですが、これはダメでした。
108:Name_Not_Found
19/02/23 23:11:58.51 .net
>>106
x = x++;
109:Name_Not_Found
19/06/03 16:33:20.18 .net
izimodal使ってる人がいたら教えて欲しいんだけど閉じるボタンの色変えるのどこ弄ったら良いですか？
オプションのIconColor設定しても変わらんし、izi Modal.cssでicon関連の色変えてみても反映されないの…
110:Name_Not_Found
19/06/05 14:47:29.13 .net
>>106
やりたいのはこんな感じ？
＜！ｄｏｃｔｙｐｅ ｈｔｍｌ＞
＜ｈｔｍｌ＞
＜ｈｅａｄ＞＜ｍｅｔａ ｃｈａｒｓｅｔ＝”ｕｔｆ－８”＞＜／ｈｅａｄ＞
＜ｂｏｄｙ＞
＜ｓｃｒｉｐｔ＞
ｌｅｔ ｘ ＝ ０；
ｃｏｎｓｔ ｙ ＝ ５；
ｃｏｎｓｏｌｅ．ｌｏｇ（”ｘ： ”＋ｘ）；
ｃｏｎｓｏｌｅ．ｌｏｇ（”ｙ： ”＋ｙ）；
ｉｆ （ｘ ＝＝＝ ０） ｛
ｘ ＝ ｙ
｝ ｅｌｓｅ ｛
ｘ＋＋；
｝
ｃｏｎｓｏｌｅ．ｌｏｇ（”ｘ： ”＋ｘ）；
ｉｆ （ｘ ＝＝＝ ０） ｛
ｘ ＝ ｙ
｝ ｅｌｓｅ ｛
ｘ＋＋；
｝
ｃｏｎｓｏｌｅ．ｌｏｇ（”ｘ： ”＋ｘ）；
＜／ｓｃｒｉｐｔ＞
＜／ｂｏｄｙ＞
＜／ｈｔｍｌ＞
111:Name_Not_Found
19/06/05 14:49:43.58 .net
こうかな
＜！ｄｏｃｔｙｐｅ ｈｔｍｌ＞
＜ｈｔｍｌ＞
＜ｈｅａｄ＞＜ｍｅｔａ ｃｈａｒｓｅｔ＝”ｕｔｆ－８”＞＜／ｈｅａｄ＞
＜ｂｏｄｙ＞
＜ｓｃｒｉｐｔ＞
ｌｅｔ ｘ ＝ ０；
ｃｏｎｓｔ ｙ ＝ ５；
ｃｏｎｓｏｌｅ．ｌｏｇ（”ｘ： ”＋ｘ）；
ｃｏｎｓｏｌｅ．ｌｏｇ（”ｙ： ”＋ｙ）；
ｘ ＝ （ｘ ＝＝＝ ０） ？ ｙ ： ｘ＋１；
ｃｏｎｓｏｌｅ．ｌｏｇ（”ｘ： ”＋ｘ）；
ｘ ＝ （ｘ ＝＝＝ ０） ？ ｙ ： ｘ＋１；
ｃｏｎｓｏｌｅ．ｌｏｇ（”ｘ： ”＋ｘ）；
＜／ｓｃｒｉｐｔ＞
＜／ｂｏｄｙ＞
＜／ｈｔｍｌ＞
112:Name_Not_Found
19/06/05 14:53:34.57 .net
【要点】
>>106
> x = (x === 0) ? y : x++;
>
> この書き方間違ってますか？
x = (x === 0) ? y : x+1;
113:Name_Not_Found
19/06/05 18:16:49.43 .net
>>109-110
全角読みづらい
114:Name_Not_Found
19/06/05 18:22:48.19 .net
>>112
半角だと投稿できないからな
まともなテキストエディタなら「半角⇒全角」は5秒かからないな
>>111 は読めるよね
115:Name_Not_Found
19/06/06 08:27:37.48 .net
>>113
まともなプログラマなら、jsfiddleやcodepen等の外部サイトを使う
116:Name_Not_Found
19/06/06 14:05:05.55 .net
煽らないと死ぬ病気かあ
117:Name_Not_Found
19/06/06 18:51:03.28 .net
目には目を
118:Name_Not_Found
19/06/08 12:57:38.01 .net
先日、どっかの外部サイトがサービス提供終了になってなかったっけ
119:Name_Not_Found
19/06/19 19:47:26.91 .net
下記のようなtableに対して
<table>
<tbody>
<tr>
<td><input type="checkbox"></td>
<td><input name="tes" value="1"></td>
</tr>
</tbody>
</table>
checkboxをクリックしたら兄弟のinputのvalueを取得したかったのですが下記のコードを試してもvalueは取れませんでした
$('input:checkbox').on('click',function(e)){
var tes = $(this).closest('tr').children('td:eq(1)').val();
});
どう書けば良いかお教え下さい
120:Name_Not_Found
19/07/28 06:54:08.31 G4QBZ3uk.net
Showroom を見るときに、多くのアバターが邪魔なので削除していますが、
要素を削除するのに、一々、その親要素を取得して、親から子要素削除するのは、面倒
var elem = document.getElementById('js-avatar');
elem.parentNode.removeChild(elem);
121:Name_Not_Found
19/07/28 09:21:15.51 .net
ずさん管理 札幌ひばりが丘病院と元薬剤師ら書類送検
URLﾘﾝｸ(dai.ly)
122:Name_Not_Found
19/07/30 00:04:58.05 .net
URLﾘﾝｸ(i.imgur.com)
123:Name_Not_Found
19/09/02 21:37:41.12 .net
window.openで新しくタブを開き、input要素に文字を入れたいのですがどうのように刷れば良いでしょうか？
仮にjquery.comの検索ボックスに入力するとして、
var foo = window.open("jquery.com");
foo.$(".ds-input").val(333);
としたら出来ました！！？！？！？
さっきまでは出来なかったんですが・・・すいません
ありがとうございました
124:Name_Not_Found
19/09/02 21:43:15.45 .net
var foo = window.open("jquery.com");foo.$(".ds-input").val(333)
と一行で書くと駄目みたいです
jqeuryが読み込まれていないせいでしょうか
125:Name_Not_Found
19/10/02 14:18:17.64 .net
jQ勉強中です。containsを覚えました。ですが、例えば
$('td:contains("abc")')
という指定をすると、td自体だけでなくその子孫要素のどれか１つにでもabcを含むとマッチしてしまいますが、そうじゃなく、
td要素自体が直接abcというテキストを持っている要素だけにマッチするようにするにはどうしたらいいでしょうか？
126:Name_Not_Found
20/02/01 11:30:43 .net
<div class="result"></div>にajaxを使って
.done((data) =>{
$('.result').html(data);
})
でtableを表示してるのですが、
そのtableをマウスクリックした明細行の情報を取得することは可能ですか？
127:Name_Not_Found
20/02/29 22:05:16 .net
すみません、わかる方がいらっしゃれば教えていただけないでしょうか。
<table>
<tr class = '010'> <td>あ</td>い<td>う</td>え<td>お</td> </tr>
<tr class = '010'> <td>か</td>き<td>く</td>け<td>こ</td> </tr>
<tr class = '020'> <td>さ</td>し<td>す</td>せ<td>そ</td> </tr>
<tr class = '010'> <td>�
128:ｽ</td>ち<td>つ</td>て<td>と</td> </tr> <tr class = '010'> <td>な</td>に<td>ぬ</td>ね<td>の</td> </tr> <tr class = '020'> <td>は</td>ひ<td>ふ</td>へ<td>ほ</td> </tr> <tr class = '010'> <td>ま</td>み<td>む</td>め<td>も</td> </tr> <tr class = '030'> <td>や</td>ゆ<td>よ</td>？<td>！</td> </tr> </table> 【やりたいこと】 「き」のセルをクリックしたら同じclass='010'の中で直後にあたる 「た」行のみ背景色を変えたい。 【困っていること】 以下のようなコードを書いたのですが、当然のことながらclass='010'である すべての行の色が変わってしまいます。（$(this)は「き」の<td>です） $(this).parent().siblings('.010').css("background-color", "#ffcccc"); これをclass='010'である行の内、「き」の<td>が含まれる列の直後の列に 限定することはできるのでしょうか。
129:Name_Not_Found
20/07/24 07:06:56.94 .net
そもそも「き」はテキストノードでtd要素になってない。htmlから勉強しなおしてください。
130:Name_Not_Found
20/07/24 11:49:34.74 .net
半年経ってやっと回答付いてるｗｗ
131:Name_Not_Found
22/08/19 00:59:08.21 cMF1ija4.net
すんませんjQueryの質問なんやけど
eachでliタグの子要素のimgタグを取得してalt属性を追加して値はliタグの子要素のemタグのテキストにしたいんだが
全部のliタグの子要素のemタグのテキストを追加してしまう
対応するliタグの子要素のemタグのテキストをそれぞれ追加したいんや！
おせーてくれ！！たのんます！！
132:Name_Not_Found
22/08/19 13:26:40.78 .net
li タグの子の、img タグのalt 属性に、
同じliタグの子の、em タグのテキストを設定する
<li><img src="a.jpg"><em>あい</em></li>
<li><img src="b.jpg"><em>abc</em></li>
$( function ( ) {
$( 'li' ).each( function( ) {
const that = $( this );
that.children( 'img' ).attr( 'alt', that.children( 'em' ).text( ) );
} );
} );
結果
<img src="a.jpg" alt="あい">
<img src="b.jpg" alt="abc">
133:Name_Not_Found
22/09/21 13:20:03.39 .net
生のDOMを取得するときには
$("#unko")[0]
ってやるけど、これって正式な手順なの？ それとも有名な裏技扱い？
DOM取得メソッドって存在するっけ？
134:Name_Not_Found
[ここ壊れてます] .net
>$("#unko")[0]
単に、これじゃダメなのか？
abc クラスが2つ以上あればダメだけど、1つならどう？
const abc = $( '.abc' );
135:Name_Not_Found
[ここ壊れてます] .net
.get(0)
136:132
22/09/24 00:37:46.06 .net
>>132
修正
>const abc = $( '.abc' );
これはダメでした！
やっぱり以下のように、インデックスも必要でした
const abc = $( '.abc' );
abc[0]
137:Name_Not_Found
22/10/26 18:08:48.79 .net
bxsliderとlightboxを組み合わせて使うと、
lightboxのグループ化がバグって同じ内容が２つずつ表示されてしまうのですが、
回避方法は無いでしょうか。。。
138:Name_Not_Found
22/12/01 22:49:59.10 .net
jQueryをマスターしたいので、おすすめの解説書を教えて下さい。
139:過去ログ ★
[過去ログ]
■ このスレッドは過去ログ倉庫に格納されています