Question

我有一个存储到变量中的js对象

var data = {
    "France":[
        {
            'population': "8M",
        }
    ],
    "Spain":[
        {
            'population': "18M",
        }
    ]
}

并且我有一个输入字段，该字段具有一些值（从下拉列表中选择）。

<input type="text" id="country1" onkeyup="myFunction()" placeholder="Select indicator" value="France">

我试图将输入的值与对象的键进行比较，然后如果该值等于键，则显示人口数。到目前为止，我试图这样做

$( ".compare button" ).click(function() {
        var c1 = $( ".first-country input" ).val(); //take value from input
        var zemlja = Object.keys(data); //take all keys from object
        var n = zemlja.includes(c1);   //check if value is included in object
        if (n) {
            $(".country1-result h1").html(data.c1[0].population);  //if value is included, add population number to result
        }  
    });

我不确定。我发现，如果我输入变量c1而不是键名，我将无法取值。如果输入密钥France的名称，则一切正常，但是如果输入c1等于France的变量，则它将无法正常工作。任何提示/帮助如何管理它。

谢谢。

Answer 1

由于c1是一个变量，因此请使用方括号表示法，以便您将属性名称用作变量：

更改

$(".country1-result h1").html(data.c1[0].population);

收件人

$(".country1-result h1").html(data[c1][0].population);

var data = { "France": [{ 'population': "8M", }], "Spain": [{ 'population': "18M", }] }
function myFunction(){}

$(".compare").click(function() {
  var c1 = $(".first-country").val(); //take value from input
  var zemlja = Object.keys(data); //take all keys from object
  var n = zemlja.includes(c1); //check if value is included in object
  if (n) {
    $(".country1-result h1").html(data[c1][0].population); //if value is included, add population number to result
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="country1" onkeyup="myFunction()" placeholder="Select indicator" value="France" class="first-country">

<input type="button" class="compare" value="Click" />

<div class="country1-result">
  <h1></h1>
</div>

Answer 2

$( ".compare button" ).click(function() {
        var c1 = $( ".first-country input" ).val(); //take value from input
        var result = data[c1] ? data[c1][0].population : '';
        $(".country1-result h1").html(result);
    });

比较javascript对象键和输入值

2 个答案: