« 『お好み焼き・焼きそばの鶴橋風月』で一杯♪ | トップページ | 『鮨処 瓢箪』で昼食 »

2012年7月13日 (金)

「input」で飛び先を変更する方法

「input」で飛び先を操作するのに苦労している。
色々調べてみたら、こうすれば良いらしい。

function next() {
    document.getElementById("form").action="next";
    document.getElementById("form").submit();
}

    ...

    <form method="post" id="form">
    <input type="button" value="sample button" onclick="next();" />
    </form>

    ...

更に発展させて、「input」にまとめて対応することができた。

    <form method="post" id="forms">
    <input type="submit" value="sample 3" onclick="getElementById('forms').action='next';" />
    </form>

ここまで来るのに…。(T_T)

ちなみに「next.java」を呼び出す場合の処理。

<%@ page contentType="text/html; charset=utf-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>sample</title>
<script type="text/javascript">
<!--
function next() {
    document.getElementById("form").action="next";
    document.getElementById("form").submit();
    // ※「form」の外の場合「document.」が必須
    // ※「form」の内の場合「document.」が省略可
}
-->
</script>
</head>

<body>
    <!--
    sample 1 通常のジャンプ
    「form」に「action」で起動ファイルを組み込んだ場合
    -->
    <form action="next" method="post">
    <input type="submit" value="sample 1" />
    </form>
    <!--
    sample 2 外部に処理を出した場合
    -->
    <form method="post" id="form">
    <input type="button" value="sample 2" onclick="next();" />
    </form>
    <!--
    sample 2 1行にまとめた場合
    // ※「input」の内に「form」は、仕様不可
    -->
    <form method="post" id="forms">
    <input type="submit" value="sample 3" onclick="getElementById('forms').action='next';" />
    </form>

</body>

</html>

忘れないように記載しておこう。

久しぶりにプログラムネタを書けたよ…。(^_^;)

|

« 『お好み焼き・焼きそばの鶴橋風月』で一杯♪ | トップページ | 『鮨処 瓢箪』で昼食 »

コメント

コメントを書く



(ウェブ上には掲載しません)




トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/108365/55175329

この記事へのトラックバック一覧です: 「input」で飛び先を変更する方法:

« 『お好み焼き・焼きそばの鶴橋風月』で一杯♪ | トップページ | 『鮨処 瓢箪』で昼食 »