javascript - onClick を使用して JavaScript 関数を呼び出す - フォーム要素の値を使用する...?

Question

javascript を使用してフォーム要素の値を取得し、それらの値を使用して「onClick」属性を使用して関数を呼び出す際に問題が発生しています。

<form name="form1">
<select name="option1">
<option value="1">Option 1</option>
</select>
<input type="image" name="itemid" value="<?=$itemid?>" src="add.png" onclick="window.parent.newAddItem(this.value,form1.elements["option1"].value)" />
</form>

私はこれがうまくいくはずだと誓いますか？これが私がやるべきことなのか、それとも別の「ベストプラクティス」の方法があるのか​​ 誰にもアドバイスできますか。

前もって感謝します！

Answer 1

選択したオプションではなく、「選択」要素の「値」プロパティにアクセスしようとしているために、問題が発生する可能性があります。代わりにこれを試してください：

// On your onclick event handler:
var option1 = form1.elements["option1"];
var selectedOption = option1.options[option1.selectedIndex];
window.parent.newAddItem(this.value, selectedOption.value);

Answer 2

あなたが投稿したものから、oFormは未定義です。

そこにあるようなインラインイベントハンドラーは避けてください。代わりに、イベントハンドラーを一元的にバインドします。これにより、JSがHTMLに含まれなくなります。

ネイティブ：

var onclick = function() { alert('you clicked me!'); };
var element = document.getElementById('some_element');
document.addEventListener ? element.addEventListener('click', onclick, false) : element.attachEvent('onclick', onclick);

jQuery

$('#some_element').click(function() { alert('you clicked me!'); });