Loading

[jQuery] formのアクションを変更する〜フォーム送信時(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関連記事

jQueryのその他記事もまとめてますので、是非お立ち寄りください(。・ω・。)

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

『三国天武』臥龍試験!クイズ回答まとめ

関連記事

コメント

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

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

CAPTCHA


New Article

  1. 三国天武 日貫槍
  2. 沙盤演武 イベント やること流れ
  3. あだち充 ポジション別登場人物まとめ
  4. 三国天武 神君陸遜(吉札陸遜)
  5. sangokutenbu_syoi

人気記事

  • 該当なし
PAGE TOP