jQueryのappendで追加した要素のclickイベントが動かない場合 by MiLKySHADe · 公開済み 2013年6月12日 · 更新済み 2013年7月24日 //ボタンクリック時にアラート $("#sampleBtn").click(function() { alert("クリック！"); }); //クリック時にアラートを出すボタンをbodyに追加 $("#addBtn").click(function() { $("body").append('<a id="sampleBtn">サンプルボタン</a>') }); 上記のコードではclickイベントが発生しない。 .bindや.clickは新たに追加されたDOMに影響を与えないからだ。 しかしon関数を使うことで容易に解決できた。 on関数は.bindや.live、.delegateの後継となる上位関数。 //ボタン
I have a huge jQuery application, and I'm using the below two methods for click events. First method HTML <div id="myDiv">Some Content</div> jQuery $('#myDiv').click(function(){ //Some code }); Second method HTML <div id="myDiv" onClick="divFunction()">Some Content</div> JavaScript function call function divFunction(){ //Some code } I use either the first or second method in my application. Which
checkboxやradioのチェック状態を調べる際にはattrではなくpropを使うのが良い。 attrでも取れないこともないですが、propで取得する方が処理が早いです。 特にIEの場合、inputに対するdisabledの処理がものすごく重く、attrでdisabledやcheckedの処理を沢山していると、無駄に最悪な感じで負荷がかかります。 ##attrとpropの取得の違い## またこの２つは、同じ値を取得してるようで異なる値を取得するので注意。 例えば の場合、 チェック時 prop true attr checked 非チェック時 prop false attr undefined という全然違う値が返ってきます。 ##なぜ解釈が違うのか## attrは純粋に 属性における値 を取得するので、この場合は、 checkされてない ↓ checkedという『属性』がない！ ↓
こんにちは、暑いですね。脇汗すごいですね。僕が。 さて今回はWebページ作成時に、私がよく使っているjQueryプラグインをまとめてみました。（たまにjQueryが必須でないものもあります。） ※紹介しているプラグインを使用する際、ライセンスは各自で再度確認してくださいませ。 Owl Carousel 個人・商用利用可能。レスポンシブでいい感じに動作してくれるカルーセルスライダーです。動作もシンプルで綺麗だし、マークアップも簡単。テキストもOK。お気に入りのプラグインです。 Owl Carousel bxSlider 個人・商用利用可能。シンプルなスライダープラグインです。レスポンシブで動作し、カスタマイズもしやすく重宝します。 jQuery Content Slider | Responsive jQuery Slider | bxSlider Glide.js デモページがカッコイイス
画像の準備 とりあえずアニメーションさせる画像を用意します。ループさせるので継ぎ目のない画像を作成した方がいいかもです。 作成したら「bg.png」という名前で保存します。 今回はこんな画像を作成してみました。 デザインがしょぼいとか言ってはいけない！ html+cssでバックグランドに画像を配置 html+cssは特別なことはなく普通に作ります。 画像はbodyの「background」で配置してみました。 html <body> <div id="container"> <h1>jQueryでバックグラウンドを無限ループ</h1> <p> このページはjQueryでバックグランド画像をアニメーションループさせるサンプルページです。 </p> </div> </body> css body{ background: #A6E9FF url(bg.png) repeat-x; margin
少し古いのもありますが、今年見かけたものを中心にフォーム周りでいつか使う機会がありそうだと思ったjQueryプラグインのまとめです。 バリデーションや各フォームエレメントのデザイン変更といったオーソドックスなものから、上手く使えばユーザビリティの向上に繋がりそうなもの、他ではあまり見ないユニークな動きを実装できるものまで様々なタイプがあります。 中にはCSS3を併用したりそのままでは日本語に対応していないというものも幾つかあるので、使う際にはブラウザやデバイス環境によっていろいろ確認する必要はあるんですが、いずれも便利なプラグインばかりです。 exValidation プラグイン作者が日本の方なので、ひらがなやカタカナといった日本語のチェックもできるバリデーションプラグイン。 Validetta シンプルで軽量なバリデーションプラグイン。 jQuery Valideasy 見た目がシンプル
以前、jQuery.uploadでアップロード画像のサムネイルの作成というエントリーを書いたので、それの実装を作ってみました。アップロードする画像を選択すると、アップロードされ、それのサムネイルが表示されます。 また、ページを離れるときに画像をJavascriptで削除していますが、実際に使うときは使わない場面も多いと思いますので、その部分は適当に削除するなり、なんなりして下さい。 デモ：http://demo.torounit.com/jquery.upload/ script.js(ajaxでのアップロード等々) [js] jQuery(function($){ //送信ボタンの非表示 $(‘#submit’).hide(); //フォームの内容が変更されたとき $(‘#img’).change(function() { var preview = $(‘#preview’); //現
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
