idによるオプション値の取得は、mozillaではなくchromeで機能します

Question

価格フィールドのmax sizeフィールドから選択したオプションの値を挿入したいとします。これはクロームでは動作しますが、Mozillaでは動作しません。私は理由を理解しようとしてきましたが、成功しませんでした。

<div class="form-group"><label class="sr-only" for="id_max_size">Max 
    Size</label><select name="max_size" title="" required class="form-control" id="id_max_size"> 
    <option value="" disabled selected>Size ↓</option> 
    <option value="10">AAA</option> 
    <option value="20">BBB</option> 
    <option value="30">CCC</option> 
    <option value="40">DDD</option> 
</select> 

document.getElementById('id_max_size').onchange = function() { 
    document.getElementById('id_price').value = event.target.value 
};; 

は、どのように私はそれがモジラで動作するのですか？私は何が欠けていますか？

Answer 1

コードを次のように変更すると動作します。 changeEventListenerを追加し、パラメータとしてeventを渡すことができます。

document.getElementById('id_max_size').addEventListener("change", function (event) { 
 
    document.getElementById('id_price').value = event.target.value; 
 
});

<div class="form-group"> 
 
    <label class="sr-only" for="id_max_size">Max 
 
    Size</label> 
 

 
    <select name="max_size" title="" required class="form-control" id="id_max_size"> 
 
    <option value="" disabled selected>Size ↓</option> 
 
    <option value="10">AAA</option> 
 
    <option value="20">BBB</option> 
 
    <option value="30">CCC</option> 
 
    <option value="40">DDD</option> 
 
    </select> 
 

 
    <input id="id_price" value="" /> 
 
</div>