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は未定義です。

あなたがそこにいるようなインラインイベントハンドラは避けてください。代わりに、イベントハンドラを集中的にバインドします。これはあなたのHTMLからJSを消し去ります。ネイティブ

：

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!'); });