skillup

技術ブログ

JavaScript

formのシリアライズ+return falseなど

投稿日:2018年6月5日 更新日:

ajaxでformの値を投稿しようとするとき、一つ一つの要素をjQueryでとっていたのですが、項目が多いとなかなか手間です。

そんな時、下記のメソッドで一気にフォーム要素を取得して投げることができます。

ずっとjQueryでコツコツとってました。もっと早く知りたかった小ネタですね・・・・

AjaxでFormデータ送信する簡単な仕方

jQuery日本語リファレンス serialize

return falseやevent.preventDefaultについて

主にリンクの遷移を止めるreturn falseやevent PreventDefaultについて

共にリンクの遷移を止める機能がありますが、それ以前の挙動については実行するか否かの動きが違います。

リンク先がわかりやすくなっているのでリスペクトも含めて、コピペします。

1分でわかるreturn false; preventDefault(); stopPropagation() の違い

jQuery のバブリング、preventDefault() や stopPropagation() の使用例

stopPropagationを使う機会があったのでメモ。

クリックするとブロック全体が閉じるような領域があったとして、その要素の中で何らかのイベントを発生させたい時、通常だとブロックが閉じてしまいます。

この場合、event.stopPropagationを使うと、親へのイベントの伝播が止まり、ブロックが閉じません。

使う機会がないとわかりませんが、わかれば一発だなと・・・・

-JavaScript

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

関連記事

no image

オートコンプリートのプラグイン

最近だとフォームの入力画面で最初の数文字を入力すると候補を予測して表示してくれる機能(=オートコンプリート)があることが一般的ですね。 いろいろなプラグインがありますが、今回お勧めしたいのはBoots …

no image

ejsのテンプレート

普段生のHTMLを書く機会はほとんどなく、画面側の仕事でもフレームワークを使うことがほとんどなので搭載されているテンプレートを使っています。 で、生のHTML/CSSの本を読んでいてejsなるテンプレ …

no image

jQuery modalダイアログについて&重複時間処理

Contents1 jqueryモーダルダイアログ1.1 あらかじめ読み込むライブラリ1.2 ソース本体1.2.1 Html側1.2.2 Javascript側1.2.3 参考リンク2 重複時間につい …

no image

JavaScriptのexport

JavaScriptのexportについて。 es6の大きなメリットとして、ライブラリをモジュール化して、外部から読み込むことができますが、読み込み方に少し癖があります。 気をつけるポイントとしては、 …

no image

package.jsonによるタスクの実行

前回の記事でgulpによるタスクの実行を書きましたが、package.jsonでこれを行うこともできます。 てっきり依存ライブラリの記述だけかと思いますしたが、様々なタスクを実行できるようですね。イメ …

アーカイブ