jquery

Uncaught Error: Syntax error, unrecognized expression: unsupported pseudo: visibleundefined

Uncaught Error: Syntax error, unrecognized expression: unsupported pseudo: visibleundefinedやたら長いスタックトレースが出るが、 未サポートの疑似要素が指定されている、、、 要はjqueryのselectorが間違っている

複数のイベントをまとめて処理したい時

formでinputのchangeやclickイベントだらけになった時に中級者に上がる為の一手。 実践、jQuery - .on()と.off()を使いこなす 1 | CodeGrid

firefoxでlabel中のテキストボックスのフォーカスが奪われる

firefoxだけで発生。 label中の要素の中にチェックボックスがあるとチェックボックスにフォーカスが移るのは仕様だが、テキストボックスなどのフォーム部品については、入力が出来なくなるのでそれでは困る。chromeやIEなどではフォーム部品は例外となってい…

$(window).onload

$(window).onloadwindow.onloadのjquery版、主にjqueryで動的に生成された要素について、bindしたりするときに使う。もっとも、その場合live使えばいいのだけど。。。

リアルタイムにテキストボックスを監視

jqueryのインクリメンタルサーチなど、jqueryで作られたフォーム部品によるテキストボックスの変化は通常のイベントとして検知できないので、こちらを使う。このプラグインは、指定したテキストボックスをタイマーで定期的にチェックして差分で変更を検知す…

jqueryでouterHtml

jqueryにはouterHtmlに当たるメソッドはないので、ちょっとトリッキーな記述が必要 いくつか、やり方があるようだが、これが一番わかりやすかった。 参考 http://nori090.hatenablog.com/entry/2013/08/30/204344

jqueryで複数イベントをまとめて処理する

$('input[type="text"]').bind("keyup change paste",function(){ }) 参考 Detecting value change of input[type=text] in jQuery - Stack Overflow

jqueryでインクリメンタルサーチを実装するときにキー入力が止まった時にイベントを実行する方法

都度実行するとコストが掛かるので、jqueryでインクリメンタルサーチを実装するときにキー入力が止まった時にイベントを実行する方法 参考 javacriptでインクリメンタルサーチとjQueryのchange - memo-mode

formのシリアライズ時に要素を追加

formの内容をシリアライズして、AJAX通信を投げることは良くあるが、 その際にパラメータを追加する方法。 var data = $(form).serializeArray(); data.push({name: 'username', value: 'this is username'}); 他 serializeObjectというメソッドを追加する方…

チェックボッスをクリックした時に背景色も変更する

cssには、:checkedという疑似要素があるので、cssだけで行けそうだが、css3では親要素に干渉する方法(css4ではあるらしい)がないので、jqueryのparentで実現する。 参考 チェックしたチェックボックスの背景の色を変更する | かちびと.net

イベントをアタッチ

jqueryには、複数のイベントのアタッチ方法があり 普段は.clickを使う。しかし、追加した要素にアタッチできない場合があるので、.live,.delegateを使う場合がある。最近のjaueryは、on,offで複数のアタッチ方法が指定できるようになったので、こちらを使う…

propとattr

最近、jqueryを始めた人がはまるところ。 jqueryの仕様変更後も、googleの検索で過去の記事が引っ掛かるため 過去の記事のサンプルがそのまま動作しないことがある。attrをpropにしてみる。と、うまく行くかも 参考 CSSは分かるけどjQueryは苦手……という人が…

jqueryでトップページへ戻るを作る

#pageTop{ font-weight : bold; font-size : 10px; background : rgba(82,74,63,0.7); -webkit-border-radius : 3px; -moz-border-radius : 3px; -o-border-radius : 3px; border-radius : 3px; color : #ffffff; padding : 40px 5px 5px 5px; position : fi…

jqueryで オーソドックスなページ内ジャンプ

オーソドックスなページジャンプ 参考 jQuery とっても簡単、ページ内リンクでスムーズスクロール | 福島県郡山市のホームページ制作、Web制作 Kyasper Web Design キャスパーウェブデザイン

jqueryで指定したセレクタのフォームをクリア

指定したセレクタのフォームをクリア $(function(){ $.extend({ clearform: function(e){ e.find('input,textarea').not('input[type=\"radio\"],input[type=\"checkbox\"],:hidden, :button, :submit,:reset').val(''); e.find('input[type=\"radio\"], inp…

スクロールバーをカスタマイズする。

参考 スクロールバーをデザインするのに使えるjQueryプラグイン「Custom Scrollbar」 | Web活メモ帳 jQuery custom scrollbar

数字をカウントアップアニメーションさせる jquery-animateNumber

基本的にjqueryを入れて、jquery.color.jsを入れjquery-animateNumberを入れて終了なのですが、元からhtmlに入力されている数値を開始値にして終了値にアニメーションする設定をスマートに記述するにはコツが要ります。 $('対象').prop('number',function(){…