Javascript - 使用2选择访问数组的元素

时间:2018-04-04 21:31:09

标签: javascript jquery

我试试这个,但它不起作用。它给了我一个包含里面字母的数组。

例如,当我选择“B”和“1”时,结果为“B”而不是“40”。

我不明白为什么?

感谢您的帮助

$(document).ready(function () {
         
                var A = [10, 20, 30];
                var B = [40, 50, 60];
                var C = [70, 80, 90];
             
                         
                var letter = $('#letter option:selected').val();
                var index = $('#index option:selected').val();
                var result = letter[index];
                $('#result').val(result);
                             
            $( "#letter,#index" ).change(function() {
                var letter = $('#letter option:selected').val();  //For example : "B" selected
                var index = $('#index option:selected').val();  //For example : "1" selected
                var result = letter[index]; 
                $('#result').val(result);  // result is "B" and not "40"
                 
            });
             
        });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

     
        <table>
            <tr>
                <td>
                    <select name="letter" id="letter">
                        <option value="A" id="A">A</option>
                        <option value="B" id="B">B</option>
                        <option value="C" id="C">C</option>                                
                    </select>
                </td>
                <td>
                    <select name="index" id="index">
                        <option value=0 id="c1">1</option>
                        <option value=1 id="c2">2</option>
                        <option value=2 id="c3">3</option>
                    </select>
                </td>
                <td>
                    <input type="text"  value="" id="result" disabled/>
                </td>
            </tr>
        </table>

1 个答案:

答案 0 :(得分:2)

我使用关联的数组将字母选择绑定到数组。它比为每个数组定义单独的数组更容易。

&#13;
&#13;
$(document).ready(function () {
  var array = {A:[10, 20, 30],
              B:[40, 50, 60],
              C:[70, 80, 90]};
  $( "#letter,#index" ).change(function() {
    var letter = $('#letter option:selected').val();
    var index = $('#index option:selected').val();
    var result = array[letter][index];
    $('#result').val(result);
  }).trigger("change");
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>     
<table>
    <tr>
        <td>
            <select name="letter" id="letter">
                <option value="A" id="A">A</option>
                <option value="B" id="B">B</option>
                <option value="C" id="C">C</option>                                
            </select>
        </td>
        <td>
            <select name="index" id="index">
                <option value="0" id="c1">1</option>
                <option value="1" id="c2">2</option>
                <option value="2" id="c3">3</option>
            </select>
        </td>
        <td>
            <input type="text"  value="" id="result" disabled/>
        </td>
    </tr>
</table>
&#13;
&#13;
&#13;