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

vuexについて

vueの変数管理に関して、vuexについて勉強したことなどを。 ざっくり言ってしまうとvuex=グローバル変数という感じかと思います。 このキーワードで検索したところヒットした記事があったんで多分間違 …

no image

途中入力離脱防止処理 JavaScript

WordPressの入力画面なんかでは実装されていますが、途中で文字入力をしてページりだすをしようとするとブラウザのアラートがでます。これも一般のお問い合わせフォームなんかでも実装可能です。 この場合 …

no image

モジュールバンドラparcelについて

現在のフロントエンドだと、es6以降の書き方が主流になっていることもあり、一度慣れてしまうとなかなか戻れない便利さがあります。 私の場合、設定が面倒だったり、Chromeではトランスパイルしなくても動 …

no image

jquery multipleについて(基本編)

selectで複数選択をするときには通常のプルダウンでも可能ですが、プラグインを使うともっとスマートに対応できます。 今回私が実装したかったのがCSVアップロードorダウンロードで項目を自由に変更した …

no image

Angular概論 モジュール、コントローラー、スコープなど

Contents1 Angularインストール2 ソース2.1 モジュール、スコープとコントローラ2.1.1  モジュールとは2.1.2 コントローラーとは2.1.3 スコープとは3 参考リンク An …

アーカイブ