jQuery(185)

185follower
harada さんのアバター 14views

placeholderをselectboxの値によって入れ替える

jQuery(function ($) { var select_val = $("selectbox").val();//selectboxの値を取得します。 if(reason... 2017年10月27日
harada さんのアバター 21views

jQuery動的に追加した要素にdatepickerを追加するには

動的に追加したinput要素でもdatepickerを動かすclassを設定していても何も起こらないということがありました。 以下のいずれかを指定することで動きました。 $('.date').not('.hasDatePicker').... 2017年10月26日
ysugiyama12 さんのアバター 11views

jQueryの.html, .val, .textの使い分け

jQueryでhtml要素を取得する際に用いる3つの方法の使い分けについて。 .html() 引数をhtmlとして書き換えることができる。つまりなどのタグも書き換えることができる。 .val() 主にフォームの値を取得する時に用いる... 2017年10月20日
ysugiyama12 さんのアバター 48views

jQueryで複数の要素を取得してforeachを用いる

jQueryでクラスなどを指定して複数の要素が取得できる場合、それらをforeachでひとつずつ処理する。 $('#my_data').each(function(i,elem){ console.log(i); console.... 2017年7月5日
harada さんのアバター 89views

ブラウザのリサイズ時に特定の幅以下になったらリロードする

以下の記述でリサイズ時800px以下の場合にリロードされるようになります。 $(window).on("resize", function() { var w = $(window).width(); if(w <... 2017年6月29日
harada さんのアバター 1,215views

Animate.cssとinview.jsを利用して要素が表示されたタイミングでアニメーションさせる

以前はWOW.jsを利用して簡単にアニメーションを導入するという記事のように、WOW.jsとAnimate.cssでアニメーションを導入させていたのですが、いつの間にかWOW.jsが商用利用の場合は有料となっていました。 そのためjQue... 2017年5月1日
ysugiyama12 さんのアバター 86views

jQuery UI のautocomplete機能

入力リストの候補を表示する時、通常のdatalistだとスマホなどでうまく表示できない場合があるので、かわりにjQuery UI のautocomplete機能を導入した。 下に一例を示す。 var list = []; list.pus... 2017年2月6日
huruhurupyotr さんのアバター 44views

return false、preventDefault()、stopPropagation()

おおまかに書くとこんな感じだそうです。 preventDefault():リンクの遷移などのイベントを無効にできる。 HTMLでリンクの形式になっていても、これが書いてあると踏んでも遷移しないということですね。 stopPro... 2017年2月2日
nissy さんのアバター 138views

bootstrap-slider スライドさせた後イベントを発火させる

タイトルの通りbootstrap-sliderで作られたスライダーにイベントを付加させるときの書き方です $(selector).slider().on(evnet,function () { //処理 }); ... 2017年1月26日
usanoko さんのアバター 65views

サイドメニューをスライドイン

$(function () { var $nav = $(".sidemenu"); $(".JS-navHoverBox").on({ "mouseenter": function(){ ... 2017年1月23日
usanoko さんのアバター 127views

アンカーリンクをスムーススクロール

$(function () { $('a[href^=#]').click(function() { var speed = 400; var href= $(this).attr("href... 2017年1月23日
usanoko さんのアバター 130views

ページトップへ戻るボタン

デモ https://usanoko.github.io/pagetopbtn/ HTML <!-- jQuery本体を読み込む --> <script type="text/javascript" src="http... 2017年1月23日
huruhurupyotr さんのアバター 96views

jQuery.post()とjQuery.ajax()

jQueryの日本語版リファレンスには、「$.postは$.ajaxの略記です」とあります。パッと見では理解できなかったのですが、それほどややこしい話でもありませんでした。 jQuery.post()は以下のように使います。   jQ... 2017年1月19日
harada さんのアバター 75views

AjaxでもURLを変更したい

pushStateという関数で、履歴やURLを操作することができるようです。 たとえばWordPressの検索画面をAjaxで動かしていたら、以下のようにすることで、 AjaxでもURLを変更することができます。 jQuery(docum... 2017年1月6日
nissy さんのアバター 144views

要素に雪を降らせる

LINEをいじっていたら雪が降っていたので、もしかしたらjQueryでできるのではと思ってCodepenを利用してやってみました! See the Pen vywdxd by Nissy (@nissy-02110114) on Code... 2016年12月25日
nissy さんのアバター 65views

jsとjQueryでforeachを行う

phpでよく使うforeachですが、jsとjQueryでもやっぱりできる!!とのことなのでハックに残しておきます。 【javascript】 //forEachメソッドを使う var a=[1,2,3,4,5] a.forEach(f... 2016年12月23日
harada さんのアバター 81views

シンプルなグラフを簡単に組み込める「jQuery Sparklines」

「jQuery Sparklines」を利用することで、シンプルがグラフを簡単に組み込むことができます。 利用方法 jQueryとjQuery Sparklinesを読み込みます。 jquery.min.js jquery.spark... 2016年12月19日
harada さんのアバター 497views

Slider for Bootstrapを利用して値をスライダーで絞り込む

Slider for Bootstrapを利用することで簡単に、値をスライダーで絞り込むことが出来ます。 利用方法 ファイルをダウンロードして、基本ファイルを読み込みます。 bootstrap-slider.css bootstrap... 2016年12月19日
nissy さんのアバター 647views

clickイベントに引数を渡す方法

初歩的内容ですが、よくやりたくなる操作なのでハックに残しておきます。 //以下のような要素を考える <p id='hoge'>click</p> //受け取った引数はevent.dataで引用する functio... 2016年12月15日
harada さんのアバター 2,123views

複数設置のslickでオリジナルの矢印アイコンを設置する

複数設置のslickでオリジナルのナビゲーションを設置し、それぞれ別に動かす方法です。 JavaScript var $sliders = $(".slide_list"); var $arrows = $('.arrows... 2016年12月12日