jquery - 从复选框中选择时显示来自jQuery JSON的相应数据

编写了一个小代码，使我可以单击变量，并在单击按钮时显示相同的相应数据。但是，这似乎没有发生，我不确定在哪里出错。

在此方面的任何帮助将不胜感激，因为我多次重做了代码，但无济于事。

<script>
    $(document).ready(function(){
        var StatJSON = {
            "Opt1":  {
                "Name": "Mat",
                "Parameter1": "65",
                "Parameter2": "30"
            },
            "Opt2": {
                "Name": "Mik",
                "Parameter1": "62",
                "Parameter2": "40"
            }
        };

        $('#btnSubmit').click(function(){
            $('input[type="checkbox"]:checked').each(function() {
                var this_input = $(this);
                if (this_input.is(':checked')){
                  resultString += [StatJSON.$(this).val()];
                }

                $('#divResult').html(resultString);
            }
        });
    });
</script>

<html>
    <head>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
    </head>

    <body>
        Options:
        <input type="checkbox" name="Station" value="Opt1">Option1
        <input type="checkbox" name="Station" value="Opt2">Option2
        <input type="checkbox" name="Station" value="Opt3">Option3
        <input id="btnSubmit" type="submit" value="submit" />
        <br /><br />

        <div id="divResult"></div>
    </body>
</html>

最佳答案

您应该使用方括号[]来动态访问对象/ StatJson中的属性。在将值分配给resultString之前，还应该检查属性是否在对象中

       $(document).ready(function(){
            var StatJSON = {
            "Opt1":  {
                "Name": "Mat",
                "Parameter1": "65",
                "Parameter2": "30"
            },
            "Opt2": {
                "Name": "Mik",
                "Parameter1": "62",
                "Parameter2": "40"
            }
        };

        $('#btnSubmit').click(function(){
            $('input[type="checkbox"]:checked').each(function() {
                var this_input = $(this);
                let resultString = '';
                if (this_input.is(':checked')){
                 if(StatJSON[$(this).val()]) {
                   resultString += StatJSON[$(this).val()]['Name'];
                 }
                 console.log(StatJSON[$(this).val()]);
                }
            $('#divResult').html(resultString);
            });
        });
    });

<html>
        <head>
            <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
        </head>

    <body>
    Options:
    <input type="checkbox" name="Station" value="Opt1">Option1
    <input type="checkbox" name="Station" value="Opt2">Option2
    <input type="checkbox" name="Station" value="Opt3">Option3
    <input id="btnSubmit" type="submit" value="submit" />
    <br /><br />
    <div id="divResult"></div>
    </body>
    </html>

关于jquery - 从复选框中选择时显示来自jQuery JSON的相应数据，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/54900195/