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/ > JavaScript ライブラリ総合質問所 vol.5 [無断転載禁止]©2ch.net
これだけ「無断転載」を削除し忘れた 乙
手元の専ブラだとスレタブにjQueryとだけ書いてあって大変わかりやすい 乙、JavaScriptスレも前後の + を削除していいんじゃないかと思った
昔からの伝統なのかずっと入ってるけど、タブを見るときに邪魔なのよね 見た目のセンスの悪さは置いとくとしても、プログラム関係なんだからしょーもない無駄は省いて欲しい JavaScript(ECMAScript)スレも名前が紛らわしいよな
普通にECMAScriptスレでいいのに あら、JavaScriptスレも立てられたのね
乙 関連スレで "[無断転載禁止]©2ch.net" を削除すると見やすいな
スレ立て時にはタイトル編集が面倒だけど、是非続いてほしい imgurとかの画像をimgのsrcに入れる前にファイルサイズを取得する方法はありますk 言ってる意味が分からんが「jquery ファイルサイズ 取得」当たりでぐぐれば回答っぽいのが出てくると思うぞ a要素をクリック時、ページ遷移しないようにするには
onclick="return false;"
とインラインで入れるしか無いでしょうか？
別のfunctnion()を走らせてからreturn falseではページ遷移してしまいます
<script>
$(function(){
var f = function (){
alert('massage');
return false;
$('a.test').on( 'click', f );
}
});
function click_a(){
return false;
}
</script>
<a class="test" href="./">|function return false|</a>
<a class="test" onclick="return false;">|onclick return false|</a>
<a class="test" onclick="click_a()">|onclick click_a()|</a> >>14
方法はいろいろあるよ。好きな方法をお試しあれ。
[1] onclick内でさらにreturnする。
関数click_aでfalseをreturn → それをonclickで更にreturnするという流れ。
<script>
function click_a(){
return false;
}
</script>
<a class="test" href="./" onclick="return click_a();">リンク</a>
[2] 併記する。
<script>
function click_a(e){
}
</script>
<a class="test" href="./" onclick="click_a();return false;">リンク</a>
[3] preventDefault()という関数を使う。
<script>
function click_a(e){
e.preventDefault();
}
</script>
<a class="test" href="./" onclick="click_a(event);">リンク</a> あ、もちろん、動的に関数をclickイベントに登録したなら関数内にreturn false;だけでもおｋだよ
（>>14のコードはちゃんと動的にclickイベントに登録できてない。）
<script>
function click_a(e){
return false;
}
$(function(){ $("a.test").on("click", click_a); });
</script>
<a class="test" href="./">リンク</a> >>15
ありがとうございます！
めっちゃ早くて助かりますｗ >>14
return false はバブリングも停止してしまう
デフォルトアクション抑止が目的ならevent.preventDefault() を推奨する IEじゃ、event.preventDefault() は効かないから
return false の方が無難 >>19
非対応ブラウザ向けにjQueryが補完してくれるはずだが…
とはいえ、IE8-をサポートする必要性はかなり低くなっている jQuery 1.x系は新機能追加はされず、今後はbug fixのみ
IE8はMSのサポートが切れており、セキュリティ上危険なブラウザ
積極的にサポートする理由はもうないよ クライアントの鶴の一声という理由がね・・・あるんだ・・・
金額が倍になってもやれっていうんだ・・・どういうことだ・・・ 図書館の館内検索みたいな閉ざされたシステムだと平気でIE6とか使ってるからな しかもIE6専用、それ以外のブラウザは一切使えないとかね
今もあるのかなぁ。あるんだろうなぁ 少なくともJavaScriptの範囲内においては
jQueryを使っておけばIE6でも動くようにすることはできる。 IE6対応なら jQuery 1.12で更新が停止しているな
クライアント希望なら仕方ないが、それでも jQuery 1.12 上で event.preventDefault() を使えばいいだろう
(DOM APIで書くとしたら event.preventDefault と event.returnValue を使い分けるが) > (DOM APIで書くとしたら event.preventDefault と event.returnValue を使い分けるが)
そういった本質的じゃないコードは書くべきじゃないね。
IE6を将来捨てるためにjQueryを使うべき IE6を切り捨てるのは event.preventDefault 一本化で終わりなんだが、何を言ってるんだ、この人は？ 将来的には捨てるけど、いますぐ捨てられないって話をしている。
捨てるときにコードを書き換えるとかありえない。 ＞捨てるときにコードを書き換えるとかありえない。
これやりたいよね・・・
不要なコードは一旦全部消してリファインしたい DBの特定データをphpで出力し、
jQueryで動きを付ける場合、
jQuery記述の変数部分にphpの記述が混在するカタチになりますが
こういうのは良くないですよね？
無理にでも分離すべきでしょうか >>31
俺が言ってるのはブラウザを切り捨てる時の話ね。
ブラウザを切り捨てて、特定のブラウザ専用のコードは
不要なコードになるって話なら、jQueryを使っていれば
そういうコードはライブラリに含まれるので、
最初から不要なコードが入らない。 >>32
jQuery（JavaScript）とPHPのコードは混ざってはいけません。
そもそもJavaScriptのコードは外部ファイルにするものです。
つまりJavaScriptの中にPHPコードを入れることは出来ません。
タグに値を埋め込むか
<input value= >>32
はい分離すべきです。
jQuery（JavaScript）とPHPのコードは混ざってはいけません。
そもそもJavaScriptのコードは外部ファイルにするものです。
つまりJavaScriptの中にPHPコードを入れることは出来ません。
タグに値を埋め込むか
<input value="PHPのコード">
<span data-value="PHPのコード">
変数定義だけのscriptタグ（※変数定義であってコードではないからOK）
<script>var data = "PHPのオブジェクトをJSON出力したもの"</script>
許されるのはこれだけです。 >>33
そして、jQueryを捨てられなくなるわけだな
依存先が変わっただけで問題は何も解決してない >>36
なにを使おうが、それに依存することに変わりはないので、jQueryだけの問題じゃない。
依存することからは避けられないので、一番楽なもの依存するのが良い。
JavaScriptのフレームワークはどれも将来性が危うい。
DOM APIが変わらなければjQuery APIも使えなくなることはない。
長く使えて安定していた。そしてこれからも安定しているjQueryが一番いい選択肢だよ。 Strutsで構築されるデータベースサイトを10万で請け負った。
もうちょっと取れたかな…。 >>39
安すぎワロタｗｗｗ
その10倍はいけるだろ。 >>37
DOM APIは実装が追いついてきているので将来的にはライブラリを使わずとも互換性を確保できる
ライブラリは用途に応じて使い分けるものでjQueryに依存だけに依存させる理由はない
君のやり方だとjQuery以外のライブラリは一つも使用しない事になるからな(jQuery以外は将来性が危うい)
>>33はブラウザ分岐コードが無くなる代わりにライブラリ依存する、ごく普通のトレードオフ jQueryは互換性を担保するためのライブラリじゃなくて
DOM APIよりも短い記述で目的を達成するためのライブラリだよ。
その前提が間違っている。もっと勉強してきなさい。 > 君のやり方だとjQuery以外のライブラリは一つも使用しない事になるからな(jQuery以外は将来性が危うい)
jQueryはDOM操作ライブラリなのだから、DOM操作以外は
別のライブラリを使うだけの話だろ。
お前じゃね？ jQuery以外のライブラリを使えないと思いこんでるのは。 >>45
俺はjQuery以外のライブラリも使う
だが、>>37はjQuery以外の将来性が危ういと思いこんでいるようだから彼からすれば他のライブラリを使えないだろう？ JavaScriptのフレームワークは、って書いてあるのに
JavaScriptのライブラリすべてって、思い込んでる所が
だめだよなぁｗ 数少ないjQueryの話題ができるスレなんだから
仲良くやってくれ >>34
2chのバグだろう
書き込み確認画面が出る際、" を使うと、そこで文字列の終了とみなされる。
" の代わりに、\" とエスケープすれば、どうだろう？
それか、書き込み確認画面が出たら、1度キャンセルすれば、確認画面は出ないようになった http://weboook.blog22.fc2.com/blog-entry-406.html
この記事を参考にさせてもらい、縦長ページの上部固定ヘッダーにメニュー(主にページ内リンク)を作ったのですが、メニューボタンを開閉する度にページの最上部に移動してしまい、メニューの役割を果たせません
メニューボタンを開閉してもスクロール位置が変わらないようにするにはどういう記述を加えたら良いですか？ >>52
おお、解決しました！ありがとうございます！
まさかこんな単純なことだったとは… href="#" とかいう手抜きはいい加減消えてほしいと思う。
サンプルプログラムはともかく、実際にはつかわないように。
間違った書き方だからこれ >>54
そういう時は正しい書き方も書こうよ
href="#top" >>55
そうとは限らないならなぁ。
実際には何もしないの意味で使っている人も多い。
何もしないつもりで書いたら一番上にいっちゃって、それを防ぐために
<a href="#" onclick="return false"> とか書くやつまでいる。
アホすぎ。 >>51
そもそも<a>で作っているのがおかしい
<button>だろう jQueryという言葉をしって5年
いまだによくわからない
いつしか調べる時がくるのだろうか
その日までアディオス >>51
<a href="#"> は IE6- で :hover がa要素にしか適用出来なかった時代の名残
今では問題ないのでa要素にする必要はない
<input type="button">
<button>
<span role="checkbox" aria-checked="false">
辺りが妥当か
特にWAI-ARIAは勉強するとわかりやすいマークアップになるのでお勧め そういや古いIEではa要素しかhover効かなかったんだな…
懐かしい通り越してすっかり忘れてた >>57 >>59
ありがとうございます！
勉強になります >>58
5年やって解らないのなら勉強方法がわ悪いと思う
jQuery以前にJavaScript(特にECMAScript, DOM)を習得する必要がある jQueryと平行してECMAScript・DOMを勉強する方が効率はいいよ すみません、教えていただけないでしょうか。
jspにてid=tasktableである表（全10行）を作成し、
それぞれの<tr>に1〜10までのidを振っています。
ボタンを押すと、idが6以上となっている行を非表示とする
ボタンを作成したいのですが、ボタンのスクリプトに
$( すみません、途中送信されました。
ボタンを作成したいのですが、ボタンのスクリプトに
$("#tasktable [id >= 6]").hide();
と組み込んでも非表示化されません。
idの指定に、大小比較を組み入れることはできるのでしょうか。 idは非表示の為だけに振ってるの？
もしもそうならidは振らないでこれでいけるよ
$('#tasktable tr').slice(5).hide(); >>65
変わったことをやる時は検索したほうが早い
https://developer.mozilla.org/ja/docs/Web/CSS/Attribute_selectors
でまぁコードはこんな感じ
tmp = $("#tasktable");
$.each( tmp, function(){
if(!$.isNumeric($(this).attr('id')))
{
return true;
}
if($(this).attr('id')>5)
{
$(this).hide();
}
}) >>65
何れにしても判定しないと駄目
$('#tasktable tr[id]').each(function() {
$(this).attr('id') >= 6 ? $(this).hide() : void 0;
}); >>65
$(this).attr('id') >= 6 && $(this).hide();
この方がスリム わざわざそんなトリッキーなことしなくてもifでええやん 色々なコードみたいからトリッキーなコードも書いてくれると嬉しい。勉強になる
でも最初に回答はしないであげてほしいｗ >>65-66
HTML5 では数字から始まるidも許容されるが、論理的な名前を付ける方が好ましいと思う
https://jsfiddle.net/x7m5t4vr/ .prop("hidden", true); じゃいかんのか？ >>76
hiddenプロパティは何の要素ノードにある？ すみません、昨晩のメニューボタン開閉の者ですがまた行き詰まってしまいました。
例のメニューはwidth700px以下のみで現れるという仕様にしました。
そして、#menuの中にあるメニューをいずれかクリックすると、#toggleと指定されているメニューボタンもクリックされメニューが自動で閉じるということをやりたくて、複数のサイトを参照し見様見真似で以下の記述してみたら偶然上手く動作しました。
$(document).ready(function() {
$('#menu a').on('click', function() {
$('#toggle').click();
});
});
しかしこれだとwidth701px以上でも動作してしまうので、
$(window).resize(function(){
var w = $(window).width();
var x = 700;
if (w <= x) {
}
を加えたら良い気がしたのですが、いくつか推測で試しても上手く動作せず、どう組み込めば良いのか分からないので教えてください。 $('#tasktable tr[id]').each(function() {
$(this).prop('hidden', this.id >= 6);
}); >>78
cssで701px以上はdisplayhiddenとした方がいい。非表示のボタンが動作するのはほったらかしで良い
それだと効果のないボタンが残ることにならないか >>76,79
HTMLTableRowElement に生えてるのか、知らなかった
しかし、HTML Living Standard にもないところを見るに非標準プロパティのようだ
https://html.spec.whatwg.org/multipage/tables.html#the-tr-element >>78
function addEvent(){
if ($(window).width() <= 700) {
$('#menu a')
.off('click') // 重複するのでeventをoff
.on('click', function() {
$('#toggle').click();
});
}
}
$(document).ready(addEvent);
$(window).resize(function(){
setTimeout(addEvent, 300); // 連続処理になるので適当な時間を設ける
}); >>83
function addEvent(){
$('#menu a').off('click') // 重複するのでeventをoff
if ($(window).width() <= 700) {
$('#menu a').on('click', function() {
...
ごめん間違ってたので一部訂正ｗ >>78
既存メニューの非表示は element.style.display === 'none' な要素ノードを探して hide()
しかし、classを付け外しする方が Selectors API で探せるし、現実的だと思うんだがな…
勿論、aria-hiddenやaria-checkedでもいい >>83,84で78の問題は解決したのですが、代わりにメニューをクリックしたときのスムーズスクロールが動作しなくなってしまいました…。
$(function(){
$('a[href^=#]').click(function() {
var speed = 400;
var href= $(this).attr("href");
var target = $(href == "#" || href == "" ? 'html' : href);
var position = target.offset().top - 50;
$('body,html').animate({scrollTop:position}, speed, 'swing');
return false;
});
}); >>86-87
画像はいいからHTML/CSS/JSまとめて https://jsfiddle.net/ にUPした方がいい >>86
そのイベントも$('#menu a').off('click')で削除されているので
#toggle. click()を関数にしてaddToggleのみ削除するようにする
function addToggle() {
return $('#toggle').click();
}
$('#menu a').off('click', addToggle); // addToggleのみ一旦削除
$('#menu a').on('click', addToggle) ; // 真の時のみaddToggleを追加 >>89
https://jsfiddle.net/qo688u62/
初めて使ったので上手くできてるか分かりませんが…。78にあたる部分は記述してない状態です。
>>90
すみません、超初心者なのであまり理解できませんでしたorz >>64-65
2chのバグだろう
書き込み確認画面が出る際、" を使うと、そこで文字列の終了とみなされる。
" の代わりに、\" とエスケープすれば、どうだろう？
それか、書き込み確認画面が出たら、1度キャンセルすれば、確認画面は出ないようになった >>92
なかなかいいね。いつも通り指摘してやろうと思ったけど、
細かい指摘点しか思い浮かばなかった。 誰も口だけ番長のアドバイスに耳を貸さないから黙っているといいよ >>92 >>93
ありがとうございます！無事解決しました！
他の方々もありがとうございました！ すみません、おしえていただけないでしょうか。
ajaxで以下の通りコーディングしようとしているのですが、
****のところに、他の関数で取得した値を入れたいと考えいます。
****に直接その関数を記述することはできるのでしょうか。
$.ajax({
url: すみません、きれてしまいました
すみません、おしえていただけないでしょうか。
ajaxで以下の通りコーディングしようとしているのですが、
****のところに、他の関数で取得した値を入れたいと考えいます。
****に直接その関数を記述することはできるのでしょうか。
$.ajax({
url: "Servlet",
type: "POST",
dataType: "text",
data: {content: ****},
success: function(data) { Objectｄから普通にできるよ
data: {content: (function() {})()}, ■ このスレッドは過去ログ倉庫に格納されています
