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>
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>
<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>
#sampleForm * {
margin: 0;
}
</style>