Loading

[jQuery] フォーム送信時(Submit時)にボタン毎に遷移先URLを変更する方法

150415322552_TP_V

「送信ボタンを複数配置して、押したボタンによって遷移するURLを変えたい」。そんな時、クライアントサイドのjQueryで実現できるようなコードをご紹介します!

概要

今回は、submitボタンに新たな属性を追加し、その属性に指定されたURLで遷移する先が決まるような仕組みで実装します!

  • 1. submitボタンに「actionURL」属性を追加する
  • 2. 各ボタンのactionURL属性に指定したURLにリンクするようjQueryコードを書く

ソースコード全体

htmlソースコード

HTML側は、submitボタンに対して「actionURL」属性を追加するのみです!

<input type="submit" actionURL="/index.php" value="送信する①">
<input type="submit" actinoURL="/complete.php" value="送信する②">

jQueryソースコード

jQuery側は、「actionURL」のあるモノを押した時に、formのaction先を変更して送信するようにしています!

$(document).ready(function(){
  $('[actionURL]').click(function(){
    if($(this).attr('actionURL') != ""){
      $('form').attr('action', $(this).attr('actionURL'));
    }
  });
});

いかがでしたでしょうか?何かございましたら、遠慮なくコメント欄にてご連絡下さい!

[jQuery] リアルタイムに入力フォームのバリデーションをチェックするコード集

[三国天武] 臥龍試験!クイズ回答まとめ(4周年祝典)

関連記事

  1. [CSS] CSSだけで手軽にコピー禁止する方法!

    2017.10.11
  2. [Excel VBA] マクロでエクセルの行の高さを自動調整する方法

    2018.06.13
  3. [SQLServer] クエリのパフォーマンス調査・ボトルネックの特定

    2017.08.08
  4. [Excel VBA] マクロで辞書オブジェクト(KEY-VALUE)の使い方ま…

    2016.09.01
  5. [Excel VBA] マクロで月の日数を取得する(当月・前月・翌月)

    2016.08.02
  6. [jQuery] カーソルをあてた時に画像を切り替える方法(マウスオーバー・マウ…

    2018.06.20

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


New Article

  1. sangokutenbu_toronazonazo
  2. sangokutenbu_nikyo
  3. sangokutenbu_ranking
  4. sangokutenbu_bunou
  5. gintama
PAGE TOP