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/ >>718
どうせお前このスレを荒らしに来ただけだろ？
数日間レスが止まってるところに、誰宛かも
わからないこと書き込んで。ばればれ 似たようなオブジェクト２つを変える関数を作っています。
仮に２つは$('#hoge-L')と$('#hoge-R')とします。将来的に２つを超えることはありません。
実際は様々な処理をしていますがここでは説明のため色を変えるだけとします。
様々な処理と言ってもLとRの違いだけで関数内の他は同じコードで共通化しています。
実際は色を変える関数、○○を変える関数など多数あり、全てLとRを操作します。
LとRは、片方だけ変えることも両方変えることもあります。
LとRの変更色は同じ場合も違う場合もあります。
で、とりあえずは
function changeColor(args,c){
$('#hoge-' + args).〜cに色変更;
}
changeColor('L',c1);
としましたが両方変える場合
changeColor('R',c2);
と２回呼び出さなくてはなりません。
これを１回呼び出しにしたいのですがどんな方法がいいでしょうか。 721の続き
(1)配列渡し
changeColor(['R',c2]);
changeColor(['L',c1,'R',c2]);
(2)引数を２つ分に固定しnull渡し
changeColor(null,null,'R',c2]);
(3)可変長引数
arguments使用
(4)(2)に加え部分適用
var pmL = function(L,c1){
return changeColor(L,c1,null,null);
}
pmL(L,c1);
とRの分。関数やたら増えますが。
(5)名前付き引数
changeColor({L:c1,R:c2});
最も自然な気がしますが引数が少ない今回の件でどうかと。
(6)その他
皆さんならどうしますか。 idなしかよ
$('#hoge-'+args)
じゃなくて
$(arg)
にして
"#hoge-L,#hoge-R"
を渡すってわけにはいかんのかね changeColorなどを実行するのに何かしらのイベントがあるとして
＞LとRは、片方だけ変えることも両方変えることも
とのことだから、「LとRそれぞれ操作 or LとR同時に操作」に対応したイベント発火ボタン要素みたいなものが複数あるパターンとすると
https://jsfiddle.net/wd8gzh70/ >>724
修正中だった？ 割り込んでごめんｗ
俺ならこうする
https://jsfiddle.net/wd8gzh70/3/
コード（処理）をごちゃごちゃ書きたくなく。
単なる定義（CSS）にすることでシンプルになる。
CSSが苦手な人は、CSSの量が増えるのが嫌だろうけどｗ
で、こっちはCSSをSCSSに変えて短くしたもの
https://jsfiddle.net/wd8gzh70/4/ >>721
LとRに両方に必ず同じものを適用するのでないなら
単純に二回呼び出したほうが良い。
そして>>723を取り入れた方がいい。
そうすれば、両方とも同じなら一回でいい
それから○○を変える関数とは全部CSSの内容か？
どんな処理をしたいのかによるが>>726を参考にJavaScriptから
CSSを変えるのではなくクラス名を変えたほうが良いかもしれない。
で、色を変えるだけというかCSSで変えられる物だけなら、
changeColorなんて関数はいらないだろ？
$('#hoge-L').css({color: 'red', fontSize: '1.5rem'});
$('#hoge-R').css({color: 'blue', fontSize: '2rem'});
とか二回呼び出して行えばいい
両方同じなら、
$('#hoge-L, #hoge-R').css({color: 'red', fontSize: '1.5rem'});
と書ける
changeColorは例で、実際にはcssメソッド以外の関数も使うんだっていうのなら、
changeHogeHoge('#hoge-L, #hoge-R', パラメータ) とすればいいし
jQueryプラグインにしてしまえば
$('#hoge-L, #hoge-R').hogehoge(パラメータ)
と書けるようにもできる。 CSSってCSSソース中のプロパティそのものを動的に変更できるのかな
例えば.hoge{color:#ff0000;}のCSSソースがあって
javascriptでCSS.class.hoge.color=#00ff00みたいに >>728
それならjs一行で解決たな。
その程度ならjQueryよませる必要なし遅くなるだけだよ。 element.style.colorじゃなくCSS（仮）.class.hoge.color
できたら便利だけどさすがに無理か すみません、HTMLの情報が不足でした。その他不足と思われることの補足です。
単純化したイメージはこんな感じです。
<select id="left-color">
<option>red</option>
<option>blue</option>
〜
</select>
<select id="left-size">
<option>12</option>
<option>14</option>
〜
</select>
他にも同様のselectがあり、左右同じ分あります。
各selectごとにchangeイベントで#hoge〜を操作しています。「○○を変える関数など多数」はこのことです。これが増える可能性は高いです。
各selectの発火は無視して最後に確定ボタンでという操作はこの件ではGUI上行っていません。
Lだけ、RだけなどのselectはGUI上作れません。読み替えということで参考にはなります。
LR両方変更の一例は全リセットをイメージしていただけるとわかりやすいかもしれません。
各関数の目的は見通し上おおまか１つにしています。
>"#hoge-L,#hoge-R"を渡す
発火したselectのidの一部を渡してるだけですのでそれでもいいです。
それとCSSは::after駆使して複雑な図形描くなどでなければ特に苦手ではないです。 >>727
>○○を変える関数とは全部CSSの内容か？
位置変更（jsで取得してjsで再設定）などもあります。初期位置はCSSですが動的に変更があります。
>changeColorなんて関数はいらないだろ？
他の部分数箇所から各関数の１つないし複数を呼び出しています。
>$('#hoge-L, #hoge-R').hogehoge(パラメータ)
LRそれぞれのパラメータを全部連想配列にしてしまえば手っ取り早いですが、１つの変更だけで全部見るのも不自然さや速度面でどうかと今のようになっています（他にも理由あったような）。
２回呼び出しの頻度は各々呼び出しに比べれば少ないので前者でいいのかもしれませんね。 > LRそれぞれのパラメータを全部連想配列にしてしまえば手っ取り早いですが、
一番やってはいけないパターン 関数は「何をどうする」
「何を」をどうするか聞かれてるのに「どうする」をゴチャゴチャやってるのはなぜなのかな
引数の渡し方について質問者についていけてないのかな それ言ったら全てそうだ
選択問題なのにどれも答えてないな 煽りばかりですな
以降は例外無く口出ししたくなる基地外のターン↓ 質問者＞＞＞回答者
いつも通りｗ
質問文読んでないし可変長引数とか意味わからないんじゃね 質問を熟読した>>742さんが回答してくれるそうですﾜｸﾃｶ ぶっちゃけどれも似たり寄ったり
(4)はfunctionが増えて利点はないだろう
それより>>735の回答はどうなった？ うむ、ここでは説明のため色を変えるだけとしますと書いてるんだから
渡した先のことはさほど書く必要ないんだよな
相手はそれくらいわかるだろ TVで報道されない真実
集計マシーン ムサシ
作ってる会社は？
ｗｗｗｗ
一番触れられたくない部分ｗｗｗ 税金垂れ流しで身内がばぶってる糞安倍特需 boxsliderについて質問です。
すでにsliderが設定されてる画像データがあります。
タブは6つで、それぞれにsliderが設定されてる画像データがあります。
そこに
ajaxで取得してきた新たなデータをおきかえて表示したいです。
1つめのタブはちゃんと表示されましたが、
後ろに隠れているタブのデータが表示されません。
この場合何か再設定をしないといけなかったりするのでしょうか？ jQuery プラグインの、bxSlider でも使えば？
【jQuery】超簡単jQueryスライダー［bxSlider］の使い方
http://on-ze.com/archives/1658 ajax通信について教えてください。
以下のスクリプトを組んでいるのですが、通信が完了しているにも関わらず、
completeのalertが実行されません。
＜スクリプト＞
$.ajax({
(略)
success: function(data) {
$('#result').html(data);
(略)
complete: function() {
alert("終了");
}
サーブレット側では、
response.getWriter().write("完了しました。");
にてメッセージを送信し、jsp側のdivである#resultにて表示がされているので
通信は正常に行われていると思います。
しかし、completeが実行されていないということは、サーブレットからの
メッセージを受信した状態であっても通信が完了していないと
みなさえれているということでしょうか。
原因がわからず、困っております。
宜しくお願いします。 webサイトで記事ではなく図のあるページ。
ユーザーがform操作によりページ内のある範囲や部品を表示・非表示。
その方法の区別や使い方で質問です。
(1)CSSに初期値を持たせる
SS…#hoge {display: none;}
JS…$('#hoge').show()、〜.hide();
(2)JSに初期値を持たせる
SS….hide {display: none;}
JS…$('#hoge').addClass('hide')、〜.removeClass('hide')
(3)HTTMLに初期値を持たせる
HTML…<〜 class="hide">
JS…$('#hoge').addClass('hide')、〜.removeClass('hide')
(2)でデフォが非表示の場合、ページ読み込み時の見た目悪いので下の方や小さい部品が主です。
みなさんはどれかに統一？
併用の場合その区別の仕方（○○の場合は(1)など）教えてください。 show と hide という単語は使わない。
メソッド名、クラス名、両方の意味でだ
showに相当するものは、display: block等だし
hideにそうとするものは、display: noneなのだから
メソッド名やクラス名にshowやhideを使う必要はない
JavaScriptでは "状態" で考えろ
JavaScriptは状態（クラス）を変えるだけだ
CSSではある状態で、表示するかどうかを書くだけだ 初期値は、チェックボックスであればcheckedで指定できるだろ
<input type="checkbox" class="parts" value="show" >
<input type="checkbox" class="parts" value="hide" checked>
この値で表示非表示を決めるのだからJavaScriptはいらんわな
.parts[value="show"] { display: block; }
.parts[value="hide"] { display: none; } >>753
それは典型的ダメパターン
再読み込みで前の状態が残る場合がある 加えて言うと、checkedは一応記述しておくがな
それと変更をどうするかなので全く答えになってない >>752
単語はわかりわすく書き換えたまでです。
>showに相当するものは、display: block等だし
>hideにそうとするものは、display: noneなのだから
承知です。途中overflowが入ることも。 >>754
> 再読み込みで前の状態が残る場合がある
なんで残ったらダメんだよ？
ブラウザでバッグしても残るだろうが は？何言ってるんだコイツ
ダメに決まってるだろ
初期化の意味なし >>758
> ダメに決まってるだろ
お前が決めただけだろ？
ページ内のある範囲や部品を表示・非表示っていうのは
例えばショップの商品絞込機能と同じなわけだが、
リロードしても今絞り込んでる条件なんか変わらねーよ 残るか残らないかって確実に決まるんだっけ？
リロードで確実に残したいものはちゃんとルーティングするかなぁ >>761
httpヘッダなどでも決まるよ。
基本ブラウザで制御させる部分だから自分で（JavaScript）で
制御するのはやめてブラウザに任せたほうが良い。
一番ダメなのはフォームとフォームでない部分を混ぜること
独自のチェックボックス風のものをJavaScriptで自作とかしたりしてね。
そうすると画面の見た目とJavaScriptの処理結果がずれることになる。
なんでだーといいながら、ページ表示時にJavaScriptで値を入れたり
ページの進むと戻るしたときにおかしくなって、
setTimeoutとかで強制的に再描画とかして泥沼に陥ることになるｗ
こういうのは状態の保持にフォームを使わないから。そしてフォームの値で
見た目をCSSで変更させないから。
一部にJavaScriptを使ったとしても、input type=hiddenなどを使って、
状態の保持にフォームを利用しておけば、確実にブラウザの挙動に
従わせることができるので、シンプルに実装することができる。
JavaScriptも使わずに実装できるので、フォームの値と画面の見た目がずれることもない。 それからフォームの内容をリセットしなければ、
まさにフォームのリセット機能が存在するので
（ input type="reset" or form.reset() ）
実は画面のリロード時に確実にフォームをリセットするのも
フォームを使っていたほうが簡単だったりする。 >>759
> 答えてるほうがレベル低いって・・・
ゴメンな答えるほうがレベル高くてｗ 一つ言い忘れていた。
> 残るか残らないかって確実に決まるんだっけ？
の話だけど、これは要するに
HTMLを修正した時、更新ボタンで画面に変更が反映されるか？
と同じ話なんだよ。
つまりキャッシュ。ブラウザの設定にもよるけど通常は
キャッシュが有効に使われる状態であれば、更新ボタンを
おしても前の画面は変更されないだろう？
ならばフォームの値もそのままなのは当然のこと。
そしてスーパーリロードだとキャッシュが使われる状態でも
リロードされる。フォームの値もリセットだ。
つまり更新を押してもフォームの値が残るっていうのは
バグでも何でも無く、ブラウザの機能なわけさ。 >>749
success, complete は、古いのかな？
今は、done, fail とか。
ヌーのサイトの情報は、古いから、気を付けな
// 全体の設定
$.ajaxSetup({
data: {format: 'xml'},
timeout: 60 * 1000
});
$.ajax( url )
.done(function( data, textStatus, jqXHR ) { })
.fail(function( jqXHR, textStatus, errorThrown ) { }); >>761
初期値はブラウザによって不確定だからタチ悪い
よってCSSかJSでイニシャライズが必要
で、問題は変更の方法だろ
CSSでdisplay:none;としておきたいとこだがaddClassだと!important使わないと、
またshow()の類でないと、ってとこがミソなんだよな フォームのリセットはリセットすればいいだけだから別によかろう。
クラスの付け方と変え方をどうしてる？って話なのにな。 form操作により、と書きましたがそれ以外に関連したりしなかったりで表示・非表示があります。
よって再表示で
>制御するのはやめてブラウザに任せたほうが良い。
>再読み込みで前の状態が残る
は困る部分もあります。formとは分けてます。後だしですみません。
>独自のチェックボックス風のものをJavaScriptで自作
そんなことはしてません。一応。 >>767
> 初期値はブラウザによって不確定だからタチ悪い
それを言ったら進むや戻るを押したときだって
ブラウザ依存なんだが。
不確定なんじゃなくて、キャッシュが使われると言うべき。
キャッシュはブラウザの設定でユーザビリティ向上のために
使われるものなので、それを無効にする方向じゃなくて
活かす方向で作るべきだよ >>769
> は困る部分もあります。
そもそも困る作り方なのが悪い。
>>770でも書いたが、例えばブラウザの設定で
キャッシュを出来る限り使う設定にしていれば
JavaScriptの状態が保存されることも有る。
保存されないことも有る。
そういったことを制御するのは大変。
今回の話でいえば単にリロードしても状態は残る
（正確に言えばブラウザの設定にもよる）わけだが
それで困ることはないだろ。通常はリロードしても
フォーム内容は維持されるものなんだから >>767
> CSSでdisplay:none;としておきたいとこだがaddClassだと!important使わないと、
> またshow()の類でないと、ってとこがミソなんだよな
!importantを使うのは作り方が悪い。
適切にaddClassを使えば、クラスを設定した時点で
もとの状態よりも優先順位の点数があがるので!importantなんか
使わずに作れる。
行き当たりばったりでスタイルを適用してるから
わけわからんくなるんだよ。 >>770
だから何としか
>>771
見たことないのに行き当たりばったりって
わけわからなくもなってないのだが >>771
君が小規模なコードしか書いたことないことはよくわかった。 基本addClassでいいと思うが（質問者もそれくらいわかってるかと）
大規模になって1つの要素に複雑にクラスがからむ場合、タグが
<hoge class="aaa bbb ccc ddd・・・> となってくるからな
表示関係、見た目デザインはＳＳで管理したいのもわかる
その要素の他の操作（値操作など）、他の要素の操作などもJS（JQ）でいじってるのだし
(1)でも悪くはないと思う ある程度は仕方ないが、HTMLはなるべくコンテンツにしぼって
操作するため装飾するためのidやclassだけにしたいな。
くどいがなるべくだがね。 ＪＱのshow()などでいじるにしても簡単な部分はaddClassで行ってもいい
問題はその線引き、というかそれが元々の質問だろ
前振り長かったな〜 >>775とか
まあ実際にコードを示さないと、どれだけシンプルに
作れるかってのがわからんのだろうな（苦笑）
と思ったねｗ
まずこっち。JavaScriptのコードは一切ない
https://jsbin.com/nozotuyaci/edit?html,css,output
これの何が良いかというと、表示非表示をする"処理"がなくて
HTMLとCSSによる"定義"のみで表しているということ
定義なので「こういう場合」は「こうなる」ことがはっきりしているので
〜してから〜するみたいな条件を織り交ぜた流れがなくなるのでバグが少なくなる
ただこのやり方には欠点があって今のCSSは親要素を参照とかできないので
HTMLの構造に制約が出る。 それを改善したのがこっち
https://jsbin.com/japiripaxo/1/edit?html,css,js,output
JavaScrpitのコードは特定の値をinput type="hidden"要素にコピーしているだけ
汎用的でコードも単純なのでバグの可能性は小さくなる
input type="hidden"にコピーしているのはキャッシュが有効に使われるようにするため
今回フォームを使うということで、検索フォームのようなものもあるかもしれない。
その場合ブラウザの標準の動きはリロードした時にフォームに前の値が残る。
値が残ったり残らなかったりするのはありえないので統一しなければいけない。
デフォルトの動きに統一する場合、input type="hidden"にコピーすることで
ブラウザの標準の動きにあわせることができる。
またブラウザの標準の動きをやめてリロード時に初期化したい場合は
form.reset()を呼び出せばいい。
また別のやり方として、input type="hidden"ではなく特定の要素、
大抵は親のブロックの何処かのclassなどに値を入れるやり方もある。
だけどこっちもフォームと混ぜた時に、リロードで値が残ったり
残らなかったりするので気をつけないといけない。 あと今はリロードの話しかしていないが、もう一つ気をつけないといけないのが
ブラウザの進むと戻る
http://nmi.jp/archives/273
> スマートフォンを含む最近のブラウザでは、戻るボタンで前のページに戻った際に、
> JavaScriptも含めて前回の最後の状態を復元します（Back Forward Cacheと呼ばれます）。
onunloadに何か入れていれば無効になるとは言え、
なぜこんな機能があるかというと、そっちの方がユーザビリティが高いから。
せっかく高くしてくれたユーザビリティを低下されるのは悪いやり方。
その場合、戻るを押した時にキャッシュされるかどうか？なんて
いちいち考えたくないだろう？
一番楽な方法はブラウザの標準の挙動に合わせる方法。
フォームだけで実現する または input type="hidden" に入れていれば
フォームの状態が残ってようが残ってまいが、そんなことは気にせずに
現在の状態という定義から簡単に画面を導出できる >>778
今回の話は前提として
>>751より
> ユーザーがform操作によりページ内のある範囲や部品を表示・非表示。
フォームを使う
>>769
> form操作により、と書きましたがそれ以外に関連したりしなかったりで表示・非表示があります。
> よって再表示で
>
> >独自のチェックボックス風のものをJavaScriptで自作
> そんなことはしてません。一応。
フォーム以外も使う。フォームを全く使わないということはない。
ということから、フォームとそれ以外が混じってるという点
つまりブラウザやその設定にもよるがリロードした時や進む・戻るを押した時に
フォームの値は残ってるがJavaScriptの描画結果はリセットされているなどという不整合が
起きる可能性がある。困ったことにこの挙動はブラウザ依存
不整合を起こさないためにはどちらかに統一する。フォームを全く使わないことはありえないので
フォームを使う方で統一する。なので状態をフォームの値として input type="hidden"にいれておけば、
不整合は発生しない。一律にフォームの内容をリセットするというのもあるがこれはユーザビリティの低下を招く。 >>776
cssもこんなことに
hoge {
プロパティ: 値;
プロパティ: 値;
プロパティ: 値;
・・・
プロパティ: 値;
}
↓
hoge {
プロパティ: 値;
プロパティ: 値;
プロパティ: 値;
}
.aaa {プロパティ: 値;}
.bbb {プロパティ: 値;}
.ccc {プロパティ: 値;}
・・・
.xxx {プロパティ: 値;}
クラスが何十にもなると上書きも出てきて視認性が落ちかねない
ライブラリも使っていれば!importantを使わざるをえない場合もある
jQueryなら1行で書ける上にメソッド見れば状態も一目瞭然
何が何でもaddClassだけで済ますのも悪いとは言わないが
保守性からもそれだけにこだわるのは賢明とは思えない >>779
親要素を参照
これホントになんとかしてほしいな
jQueryで散々自由に要素選択できてて、CSSにてこ入れ必要になったとき
親要素にidつけんと、最悪divで囲まないと、ってとき萎える
せめてparentとparents相当なものだけでも
スレチですまん addClassの難点は色変更で#808080の類
実際よくある それと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なんだから それとさ、チェックだけで決まると思ってるの？計算結果で決まる場合は？ ■ このスレッドは過去ログ倉庫に格納されています
