7

以下のような HTML フォームがあり、テキストフィールドの値を JS 変数に渡したいとします。

<form name="testform" action="" method="?"
<input type="text" name="testfield1"/>
<input type="text" name="testfield2"/>
</form>

以前は、PHP で変数に値を渡すだけでした。JavaScriptで行う場合、メソッドは必要ですか? そして主な質問、それはどのように行われますか?

4

4 に答える 4

3

以下にいくつかの例を示します。

Javascript:

document.getElementById('name_of_input_control_id').value;

jQuery:

$("#name_of_input_control_id").val();

基本的に、Javascript/jQuery を使用して DOM から入力コントロールの値を抽出しています。

于 2012-12-02T20:35:50.620 に答える
0

「送信」で次のことを試してください。

var input = $("#testfield1").val();
于 2012-12-02T20:37:48.887 に答える
0

答えはすべて正しいですが、コードを document.ready 関数に入れないと問題に直面する可能性があります... コードブロックが html 部分の上にある場合、id を持つ入力フィールドが見つかりません。存在...

document.addEventListener('DOMContentLoaded', function() {
   var input = document.getElementById('name_of_input_control_id').value;
}, false);

jQuery

jQuery(document).ready(function($){
    var input = $("#name_of_input_control_id").val();
});
于 2012-12-02T20:43:38.227 に答える
0

Javascript でテキスト フィールドを使用するだけの場合、methodまたは属性は必要ありません。action

submitこのようにボタンとonsubmitハンドラーをフォームに追加します。

<form name="testform" onsubmit="return processForm(this)">
    <input type="text" name="testfield1"/>
    <input type="text" name="testfield2"/>
    <input type="submit"/>
</form>

processForm次に、Javascriptでこの関数を使用できます

function processForm(form) {
    var inputs = form.getElementsByTagName("input");
    // parse text field values into an object
    var textValues = {};
    for(var x = 0; x < inputs.length; x++) {
        if(inputs[x].type != "text") {
            // ignore anything which is NOT a text field
            continue;
        }

        textValues[inputs[x].name] = inputs[x].value;
    }

    // textValues['testfield1'] contains value of first input
    // textValues['testfield2'] contains value of second input

    return false;  // this causes form to NOT 'refresh' the page
}
于 2012-12-02T20:45:37.070 に答える