jQuery 質問スレッド vol.7 [無断転載禁止]©2ch.net
■ このスレッドは過去ログ倉庫に格納されています
JavaScriptでDOM用ライブラリであるjQueryのスレです。
このスレはjQueryやjQuery UIの使い方やjQueryプラグインの作り方を質問するスレです。
jQueryを使って作る側のスレであって、こんなプラグインありませんか？と聞くスレではありません。
そういうのは自分で探してください。
ろくにサポートもされてなさそうな野良プラグインの使用はおすすめしません。
JavaScriptの質問は関連スレで質問して下さい。
■前スレ
+ JavaScript & jQuery 質問用スレッド vol.6 +
http://echo.2ch.net/test/read.cgi/hp/1465566635/
■関連スレ
+ JavaScript の質問用スレッド vol.122 +
http://echo.2ch.net/test/read.cgi/tech/1472426483/
+ JavaScript(ECMAScript)質問用スレッド vol.122 +
http://echo.2ch.net/test/read.cgi/tech/1472401404/
+ JavaScript の質問用スレッド vol.131 +
http://echo.2ch.net/test/read.cgi/hp/1478053599/
JavaScript ライブラリ総合質問所 vol.5 [無断転載禁止]©2ch.net
http://echo.2ch.net/test/read.cgi/hp/1465399470/
+ JavaScript & jQuery 質問用スレッド vol.6 +
http://echo.2ch.net/test/read.cgi/hp/1465566635/ それとfont-sizeやwidthなど段階的に数パターンの値を当てたいとき
これもまたよくある ページの特徴上、ざっくり書くと遷移時はリセットするとみてください。考慮しなくていいです。
する操作があった場合はメッセージを促しています。ユーザビリティ云々は承知の上です。
ページ全体が作業場になっているイメージなのです。
正確には「form部品を使った〜の操作」でした。
resetに相当するボタンはありますがsubmitはありません。
formもありますが上記の方が多いです。これは誤解の元でした。すみません。 >>770
その通りなのですがphpやセキュリティがらみだと面倒でして。
特に後者は誰もが精通してるわけでもないので。
悪意あるページから入ってこられたり。
お問い合わせフォーム程度なら両者楽勝なのですが。
書くまでもないでしょうがユーザビリティとセキュリティの両立に絶対的な正解がない現状なかなか・・・。
おそらくphp有無で質問に影響はないと思ってます。今のところ。 >>787
> ページの特徴上、ざっくり書くと遷移時はリセットするとみてください。考慮しなくていいです。
矛盾してる。
考慮しなくていいならば、遷移時（リロードや戻る）を実行したら
フォームの内容はリセットされなくなる。
検証としてHTMLにtextareaを一個置くだけのフォーム作ってやってみ
フォームの内容がリセットされないのはわかるはず
だから「リセットしたいと考慮する」ならばコードを書かないといけない。
だから何も考慮しなくていい（ブラウザのデフォルトの挙動）でいいじゃんって言ってるんだが。
> resetに相当するボタンはありますがsubmitはありません。
まさかJavaScriptでボタンをクリックしたら、フォームの内容を一個一個初期値に
相当する値に書き換えてるんじゃないだろうね？
input type="reset" ボタンが用意されてるんだからそれを使えばいい。
JavaScriptのコードは一切書かずに初期値に戻る >>791
これは重要な所なので揚げ足取りではない。 input type="hidden" を使用しないでクラスを使う方法
https://jsbin.com/sapehacuro/1/edit?html,css,js
https://output.jsbin.com/sapehacuro/1
Chromeで実行してみればわかるが
他のページに移動してから戻ると、フォームの値は残っているのに
フォームの値で表示される部分は表示されない。
Firefoxだとおそらく大丈夫（Back Forward Cacheとやらの機能）
inputの値はキャッシュされて残るがクラスはキャッシュされないため。
これを回避するには、ページが表示された時に
フォームの内容をクラスに反映させるという処理が必要になる。 クラスを使う場合、form.resetを使えばフォームの値はリセットされる。
だけどFirefoxの場合はJavaScriptのレンダリング結果がキャッシュされるので
フォームはリセットされるが、画面は表示されたままになるはず。
だからFirefoxのためにunloadイベントで適当な処理をして
Back Forward Cacheを無効にする必要があるだろうな。
せっかくブラウザが実装したユーザビリティを高める処理が台無しｗ
ながながとサンプルコードとともに書いたが、
JavaScriptに依存した処理の方があれこれ考えることが
多くなって苦労するんだよ。
不整合は見なかったことにするって考えもあると思うがｗ
一番楽で安定している手法は、基本はHTMLとCSSを用いて制御する方法。
どうしてもできない場合は、JavaScriptで足りない部分だけを補完し、
HTMLとCSSを用いた制御ができるようにすること >>788
入力値が意図した通りに入ってくるとは限らないからそれは１つの手ではある
最悪悪意あるscriptの可能性もある（テキストボックスでなくラジオボタンでさえも）
無論それはサーバサイドで処理するわけだがバリデなど値処理はJavaScript(jQuery)で行うからな
なかなかやるな、>>789よりはるか上いってるわ >>794
ブラウザ判別分岐は将来性含めてなるべく使いたくないな
> HTMLとCSSを用いて制御する方法
で>>783や>>785はどうしてる？ >>795
無理して俺に矛先向けなくていいよｗ
俺に関係ない話だろうが（それすらもわからないレベルなんでしょ？）
本気の入力チェックはサーバー側でやるのは当たり前の話。 >>796
進むとか戻るとかリロードした時の状態は
実際には些細な問題として無視されてるんじゃないかと思う。
通常は見た目だけの問題だから大きな問題に発展することはないだろう。
以前の職場のシステムは、時々ブラウザでこんな操作をすると
おかしくなりますってバグレポートが上がって
その都度行き当たりばったりで直していた。
継ぎ接ぎだらけのやつだったんで、そうするしかなかった。
でもHTMLとCSSを使って制御すれば処理はシンプルになる
（ただし必ずしもコードが少なくなるわけではない
特にCSSはsass使うのを推奨する） >>797
>>798
どうした急に、様子が今までと違って変だぞ でも、まあブラウザ周りで行き当たりばったりはしゃーない
>>796の件は他の人にもききたいわ ページ遷移・ヒストリーなどを考慮するなら、
jQuery Mobile でも使えば？ >>796
このスレには大規模や複雑な案件やったことないのばかりだから答えは期待できないだろう >>801
jQuery Mobileはウェブでスマホネイティブ風な
画面を作るためのUIフレームワーク
ページ遷移やヒストリーだけを扱うものじゃない。
ついでにいうとjQueryの名前がついてるが
jQueryを使っていると言うだけで
jQueryの拡張でもDOM操作ライブラリでもない >>802
上から目線で断じるっていうことはあなたはやったことがあるのだろうけど、炎上ネタだけ提供して何の情報も提供しないあなたは陰湿だと思った >>804
実際あなた含めて答える人いないじゃん
今まですぐレスあったのに
質問の(1)〜(3)を1人除いて誰か具体的に「俺は何番」と答えた人いた？
例えばプロフィール入力してもらうくらいならいいが、プログラム的要素が強くなってくるとブラウザ任せともいかない場合もある
HTML/CSSスレでなくここで質問してるということ プロフィール入力してもらうくらい
ではないものってなんだ？ オイオイ大丈夫かここ
嫌なヤツというなら>>752だな
記事ではなくとあるのだからそれなりの動的ページに関係してることはわかるはず
質問に答えた上で加えていうならまだしも
・基本的なことをわかってないと決め付けている
・質問に関係ないことを上から目線 >>807
> 質問に答えた上で加えていうならまだしも
質問に答えてるぞ？
>>753の書き込みから、jsbinにサンプルコードもまで書いたろ？
お前は何をやった？ * HTML側ではcontrolled componentは一律hidden
* JavaScript側で表示/非表示の初期値を持つ
* DOM構築時にJavaScript側の初期値に従ってhidden除去
が好み(Reactに近い振る舞いというのもある) ウェブの世界はHTMLベースとJavaScriptベースの
二極化になってるよね。 >>809
>この値で表示非表示を決めるのだから
その決め付けはおかしい
そこがcheckedだろうが他の要因で表示非表示になるケースも考えられる
単純な表示非表示のチェックボックスとは限らないだろう
もしそうなら他の要因でそのチェックも連動すればいいだけだが >>812
他の要因があるなら、他の要因（複数のinput要素）を
組み合わせればいいだけじゃん
実際に書いてあげなきゃわからない？
↓これ両方がチェックされた時に表示される
<input id="a" type="checkbox">
<input id="b" type="checkbox">
<div>ok</div>
div { display: none}
#a:checked + #b:checked + div { display: block} 8つの要因で決まるとしたら8つ条件並べるわけだ・・・ありえね〜 >>814
並べなくていいだろｗ
そのためのsassなんだから それとさ、チェックだけで決まると思ってるの？計算結果で決まる場合は？ ん？ もしかして何もしれないのかもしれないけど、
CSSは、#a:checked だけじゃなくて
＃a[attr="value"]のような任意の値を使うこともできるんだよ。 >>818
その場合は、取得座標から現在地の種類を
判断するところまでがJavaScript
現在地の種類をクラスやフォームに入れておけば
CSSで処理できる。
もっとも取得座標っていうのはマウスの座標だろうし
キャッシュされることはない値だから関係ない話になるけどね >>819
それよく使ってる
JSでその値変えればSSに従って変わるのだが、イコール、含む、始まるなどはできるが範囲指定などはできない
初期設定ならそこまで不要な場合がほとんどだが実行中はそうはいかない場合もよくある >取得座標っていうのはマウスの座標だろうし
このスレなんでこう決め付けるのいるんだろうな >>822
いや、だからCSSには限界があるので、その場合はCSSの限界を
補うような形でJavaScriptを使えって言ったじゃん？
例えば、input type="number"で値の複数の範囲指定したいなら
<input type="number" value="10" data-threshold="0:10:20:30:40">
みたいにして
JavaScriptで値が変化するたびに、data-thresholdの中と値を比較して
0〜9ならclassにt0、10〜19ならt10、20〜29ならt20 とか
入れれば良いんだよ。 >>794で言っていたな
> 一番楽で安定している手法は、基本はHTMLとCSSを用いて制御する方法。
> どうしてもできない場合は、JavaScriptで足りない部分だけを補完し、
> HTMLとCSSを用いた制御ができるようにすること >>826
それはわかってる
上でHTMLとCSSのみに固執してたのがいたから同一人物かと勘違いしてたわ、スマン >>825
質問にしろ全部書けないだろ
長いとそれはそれで読まれないし突っ込まれるし
座標っても領域やサイズなど色々あるのに何その根拠？ってのは俺も思った >>828
ん？ それどうせ俺だろ？
俺は最初から固執してないが、たまたまそのレスでは
javaScriptに言及してなかったんだろ
フォームの話では初期値はHTMLに書いておくのが正しいし
表示非表示はHTMLとCSSで行うのが良い。
どーしてもできないって所は、その場所限定の適当なコードを
書くんじゃなくて、どうやればHTMLとCSSで表示非表示を
制御できるか？を考えて汎用的なパーツにするのが良い。
そうすることでDOM APIでは面倒な、一括して複数の要素に対して
処理を適用できるというjQueryのパワフルな能力を活かすことができる。 >>829
> 座標っても領域やサイズなど色々あるのに何その根拠？ってのは俺も思った
座標って言ってない。「取得座標」だ。
領域やサイズの「取得座標」ってなんのことだ？
サイズの「取得座標」ってなんのことだ？ >>831
いちいち細かい、それを揚げ足とりと言うんだよ
それくらい脳内変換しろよ 明らかに説明が足りないことを言う
誤解するのを狙って、実際に誤解したらそこを執拗に攻撃する。
罠だったんだな。 あ、分かってないと思うけど、フォームっていうのはHTMLの
フォームのことでこれはHTMLであってJavaScriptではないからなｗ >>837
だな
もうこれ以上は不毛なやりとりが続くだけだろう つまり俺だけがまともなことを言って、
そのまともなことを言われるのが気にいらないやつは
煽っておしまいということかね？ｗ
お前はまともなやり取りをしたかって話だよ。 >>805
俺は答えを知らない
知っているのに答えないのと、知らないので答えられないのはまるで違う
あなたはどちらなのかね？
あなたが答えを知っているのなら、他人を冷やかすだけでスレに貢献しない人だ
あなたが答えを知らないのなら、知ったかで確証のないこと(>>802)を書くいい加減な人だ
どちらにしても、信用できる人だとは思えない >>841
俺は>>805じゃないが
質問者に答えてるのは俺だけだったと思うよ >>814
8つの条件の組み合わせを考えると、2^8 = 256 通りの組み合わせ爆発で、
CSS, JavaScript のどちらでも、プログラミングの設計段階で破綻している
こういう仕様を作ったら、ダメ >>844
表示、色、サイズ等を変更するなどよくあるケース
jQueryならチェーンメソッド1行で済む
問題は設計仕様ではなくSSだけで済まそうとするそのやり方 全部SS（スタイルシート？誰も使ってない略語を使うな。恥ずかしい）
でやろうなんて言ってない。
JavaScriptでやるのは状態の管理までで
見た目はスタイルシートでやるという話だ >>846
>JavaScriptでやるのは状態の管理までで
>見た目はスタイルシートでやるという話だ
それは皆わかってるからもういいよ
くどいったらありゃしない
それを踏まえた上で話してんだろ >>848
元はその線引きをどうするということなんだよな
例えば実際、１つの要素にこれらを指定するときみんなはどうしてるのだろう？
表示
<label><input type="radio" name="hoge" value="block" checked>表示</label>
<label><input type="radio" name="hoge" value="none">非表示</label>
色<input type="color">
文字サイズ
<select>
<option>8</option>
<option>10</option>
〜
<option>72</option>
</select>
文字サイズは少なければ属性でできなくもないが<option>変更の度にCSSも変えなくてはならないので保守性悪い >>849
そんなものはユーザCSSの範疇なので、作ろうとも思わない >>842
>>776？
唯一答えてるのは776だけだが >>853
頼むからそいつを刺激しないでくれ
餌を与えれば、誰にでも食いついてくる輩だぞ >>852
不必要とはどういうこと？案件によるし君がこの件の何を知ってると？
そんなに特異な条件ではないぞ たぶんお問い合わせフォームかその延長くらいしか手がけたことなくて想定できないのでは >>853
フォームを使わない派の人？
であればリロードしたときや進む・戻るを
押した時にフォームの値と画面がずれる件を
どう対処してるか聞きたいんだけど >>857
俺が言いたいのはそこなんだよね。
みなさん、そこまで考えたことありますか？ってこと
確かに少しぐらいフォームと見た目がずれていても
ブラウザのせいですとか言って逃げるのもありだし、
キャッシュを強制的に破棄してリセットするのもありだろう。
仕事は時間が有限に有るわけじゃないから手抜きするのも
ありなんだけど、それはそれとしてブラウザの挙動をちゃんと
理解して最善の方法も提案できないとダメだと思う。
それができないと小規模なコードしか書いたことがないように見えてしまうよ フォームを使わない「派」？
<form>は使ってるよ
ずれは案件による。大雑把に言うと
・単純なものはブラウザまかせ
・図形など複雑なのは初期化（クッキーが関係してくる場合もあるので）
いずれにしろ必要なときに正確に取得することには注意してる
当たり前だが >>859
図形とフォームが結びつかないんだけどどういうこと？
ドローツールみたいな物の話をしてる？ 加えて書くと、<form>を使うか、使わず部品だけ使って即座に反映させるかは時と場合による
ユーザ目線での使いやすさ、他の部分及び全体との統一性、仕様、引継ぎなら元の状態などなど
書いててばかばかしくなる >>861
ユーザー目線での使いやすさやそこに書いてある理由は
フォームを使わない理由にはならないよ。
例えば、日付入力のinput要素があったとして
最近のブラウザはHTML5のリッチなインターフェースを
出すようになったけど古いブラウザでテキスト入力になるから
ユーザー目線で使いやすように独自で作ろうとなったとする。
だけどこれはフォームを使わない理由にはならないのはわかるよね？
Bootstrap Datepickerとかを使ったことが有る人ならわかると思うけど
textタイプのinput要素がリッチな日付選択フォームに化けるんだよ
この発想の応用で「ユーザーが何かしらの値を入力するもの」は
全てフォームのinput要素で実現できる。
（もちろんinput要素を使いやすいインターフェースに化けさせるわけだけど）
たしかに使いやすさのためにフォームが適切じゃないのはあるだろうけど
ドローツールみたいな具体的な利用例を書いてくれてないので、説得力がないんだよ。 たしかに案件による。殆どの案件はフォームで良い
フォームが適切じゃない案件はほとんどない。
探せば有るだろうけどぱっと思いつかないぐらい。
という意味で案件による。 「案件による」っていうのは反論ではない。
何が食べたい？なんでもいい。これと同じぐらい意味がない答
だからそんなにムキにならなくていい。 いやそれはそうなんだけど、せっかくレスするなら
自分の意見を言ってくれと >>862
>説得力がないんだよ。
別にいいよ、そんなつもりないから
>>857にレスしただけだ
クライアントでもないお前さんにあれこれ言われる筋合いはないし、
うちのやり方なんてどうでもいいだろ？ 割り込み失礼。
>>849の１つの要素（オブジェクト）に、>>852の不必要なものって何でしょう？
タグ何か余分？ > うちのやり方なんてどうでもいいだろ？
あなたのやり方はどうですか？
という質問に対して、
うちのやり方なんてどうでもいいだろ
は、なんのために答えたんですか？レベルなんだけどｗ
正解が有る問題だと思ってるのかな？
正解がない問題は、あなた（だれか）のやり方を
聞くしか無いでしょうに。 >>871
客にどちらが良いと思う？という質問された時に
場合によるなんて言っていたら仕事無くすよ？
場合によるならば、○○の場合はこうで
××の場合はこうです。という答え方をしなきゃ
質問している方だって「場合による」っていうのは
分かって専門化の判断基準っていうのを聞いてるんだよ。 >>870
↑うざーーーーーーー
絡まないほうがいいよ つか、なんで新人に対しての顧客対応の
やり方みたいなのを説明しなきゃならんのだよｗ >>872
↑もっとうざーーーーーーー
自分が客だとでも いや「場合による」で答えたつもりになってるのは
恥ずかしいなぁって話だよ。 >>873
871が読めないらしい
もうスレ違いになってきてるしな >>877
そういう話なら、>>871にレスしている
>>872を読むべきでは？ jqueryスレッドがあったのでこちらに書かせてください。
fancybox3のサイトの記述通りにパーツを落とさないでリンクを貼るだけのやりかたで
fancyboxを動かしています。
この場合はオプションが追加可能な下記スクリプトで
<script type="text/javascript">
$("[data-fancybox]").fancybox({
オプション
});
全画面中の透明なし、背景色の指定、枠線追加等はできないでしょうか？
やはりcssとjsファイルを落として自分で書き換えないと無理でしょうか？
どなた教えてください。 分析解析などの分野でOK/キャンセルボタンがない場合がある。
resetもあるわけがない。（事前確認によるその類はあるが。）
よってformが不要なことはある。 OK/キャンセル/resetボタンがないから
formがいらないっていうのは短絡的だな
input要素を一塊にして扱うならば、
formにしておくことで、JavaScriptから
一括でデータを読み込んだりキャンセルできる 短絡的な発想ついでに言っておくと、
submitボタンがないからといって、
Ajaxを使わなければいけないってことにはならない。
formにしておけばsubmitメソッドが使えるからだ だろ、その分野を知らない>>881
そこはclickだろ submitがいらないっつーのに「submitが使えるからだ」て >>884
よく読め
OK/キャンセル「ボタンがない」場合だ
ボタンがないだけでsubmitしないとは書いていない ■ このスレッドは過去ログ倉庫に格納されています
