formObject.methodプロパティ

formObject.methodは、form要素(フォーム要素)のmethod属性を取得、もしくは、設定するプロパティ。

構文

取得

var $method = $formObject.method;

戻り値

form要素(フォーム要素)のmethod属性の値。

設定

$formObject.method = "method";
method
データの送信の仕方を次の2つから指定する。
  • get:URLの後にデータを付け加えて送信。URL?nameA=valueA&nameB=valueB
  • post:URLの後にデータを付け加えないで、本文に格納して送信。
初期設定値は「get」。

サンプル

変更後のform要素のmethod属性の値:

検索語:

サンプルの動作について

  • 「get」ボタンをクリックすると、form要素のmethod属性の値を「get」にする。「変更後のform要素のmethod属性の値:」の右横に「get」と表示する。「送信」ボタンをクリックすると、「検索語:」の右横のテキスト入力欄の内容を、GET形式で「http://alphasis.info/」に送信する。
  • 「post」ボタンをクリックすると、「変更後のform要素のmethod属性の値:」の右横に「post」と表示する。「送信」ボタンをクリックすると、「検索語:」の右横のテキスト入力欄の内容を、POST形式で「http://alphasis.info/」に送信する。

サンプルのソースコード

JavaScript

<script type="text/javascript">
function setMethod( $method ) {
    var $elementReference = document.getElementById( "sampleForm" );
    $elementReference.method = $method;
    var $method = $elementReference.method;
    document.getElementById( "sampleOutput" ).innerHTML = $method;
}
</script>

HTML

<button onclick="setMethod('get');">get</button>
<button onclick="setMethod('post');">post</button>
<p>変更後のform要素のmethod属性の値:<span id="sampleOutput"></span></p>
<form id="sampleForm" method="get" action="http://alphasis.info/" target="_blank">
    検索語:<input type="text" name="s" value="JavaScript">
    <br />
    <button type="submit">送信</button>
</form>

CSS

<style>
#sampleForm * {
    margin: 0;
}
</style>

スポンサード リンク

カテゴリー: DOM, Formオブジェクト, JavaScript, プロパティ, リファレンス パーマリンク