來自兩個選擇框的JavaScript Div onchange抓取值

Question

我試圖做到這一點，以便當div中的一個選擇框發生更改時，它將同時從該選擇框和另一個尚未添加的值中獲取值，但是我不知道該怎么做。
我目前有此代碼

<select id='selMag' onchange='getSelMag(this)'> 
    <option value='0.0>Select Minimum Magnitude</option> 
    <option value='1.0'>1.0</option> 
    <option value='2.0'>2.0</option> 
    <option value='3.0'>3.0</option> 
    <option value='4.0'>4.0</option> 
    <option value='5.0'>5.0</option> 
    <option value='6.0'>6.0</option> 
    <option value='7.0'>7.0</option> 
    <option value='8.0'>8.0</option> 
    <option value='9.0'>9.0</option> 
    <option value='10.0'>10.0</option> 
</select>

function getSelMag(sel) {
    value = Number(sel.value);
    console.log(window.value);
}

就目前而言，從抓取它可以很好地工作，但是我想添加另一個並將其放在容器div中，並進行更改，以便在任何一個更改時都將從它們兩個中抓取值，將兩個字符串加在一起，然后將它們轉換為數字。 我打算做到這一點，以便上面的選擇框不會有十進制值，而只是1、2等，第二個框是.1，.2等，因此將它們加在一起時，它將顯示1.1 ，1.2等。

Answer 1

使用此鏈接的答案可獲得getSelMag（）函數中其他選擇框的值

獲取使用JavaScript在下拉列表中選擇的值？

如下：

function getSelMag(sel) {
    value = Number(sel.value);
    console.log(window.value);
    var e = document.getElementById("selMag2");
    var option2 = e.options[e.selectedIndex].text;
    //do whatever u want
}

您可以使另一個函數x（）被您創建的其他選擇框調用，並從中訪問第一個選擇框的值。

<select id='selMag2' onchange='x(this)'>

如

function getSelMag2(sel) {
    value = Number(sel.value);
    console.log(window.value);
    var e = document.getElementById("selMag");
    var option1 = e.options[e.selectedIndex].text;
    //do whatever u want
}

希望這可以幫助

Answer 2

大概是選擇形式。 為了成功，表單控件必須具有名稱，因此：

<select id='selMag' name='selMag' onchange='getSelMag(this)'>

添加名稱幾乎總是消除了ID的要求。 如果另一個選擇也具有名稱：

<select name='selMag2'>

它屬於第一種形式，您可以通過以下形式從getSelMag函數中引用它：

function getSelMag(sel) {

    // Always declare variables
    var value = Number(sel.value);

    // Access them from the appropriate scope
    console.log(value);

    // Reference the other select using named properties of the form
    var otherSelect = sel.form.selMag2;

    // Do stuff with it
    var otherValue = otherSelect.value;
}

請注意，所有表單控件都具有引用其父表單的form屬性，並且可以通過表單的elements集合訪問屬於表單的控件。

具有名稱的屬性（在某些瀏覽器中具有ID的屬性）可以作為表單和元素集合的命名屬性來訪問，也可以作為集合中的索引來訪問。

似乎您希望將值之間用句點連接起來，因此該函數可能類似於：

function getSelMag(sel) {
    var value0 = sel.form.selMag.value;
    var value1 = sel.form.selMag2.value;
    console.log(value0 + '.' + value1);
}

和HTML：

<form>
  <select name="selMag" onchange="getSelMag(this);">
    <option value="0" selected>0
    <option value="1">1
    <option value="2">2
  </select>
  <select name="selMag2" onchange="getSelMag(this);">
    <option value="0" selected>0
    <option value="1">1
    <option value="2">2
  </select>
</form>