web-dev-qa-db-ja.com

テキスト入力をonclickハンドラに渡すjavascript

次のようなフォームがあるとしましょう。 「configname」という名前のテキストボックスの値をonclick関数ハンドラに渡すにはどうすればよいですか？

<form id="loadconfigform">
        Config Name: <input type="text" name="configname" />
        <input type="button" value="Submit" onclick="onLoadConfigPress(configname)" />
    </form>
javascripthtmlonclick
19
user623879

入力フィールドにidを指定します。

<input type="text" id="configname" name="configname" />

次に、クリックハンドラーを次のように変更します。

<input type="button" value="Submit" 
  onclick="onLoadConfigPress(document.getElementById('configname').value)" />

または、そのページにフォームが1つしかない場合は、forms配列も使用できます。

<input type="button" value="Submit" 
  onclick="onLoadConfigPress(document.forms[0].configname.value)" />
24
Sarfraz
<form id="loadconfigform">
        Config Name: <input type="text" name="configname" />
        <input type="button" value="Submit" onclick="onLoadConfigPress(document.getElementsByName('configname')[0].value)" />
    </form>

名前を使用して呼び出します。ただし、IDを使用することをお勧めします。

同じ名前の他の要素がある場合、これは機能しません。そのため、他の回答が示唆しているようにIDを使用してください。

1
Some Guy
<form id="loadconfigform">
   Config Name: <input type="text" id="configname" name="configname" />
   <input type="button" value="Submit"
     onclick="onLoadConfigPress(document.getElementById('configname').value);" />
</form>
1
Andrew D.