Question

这是我关于stackoverflow的第一篇文章，所以如果我的问题不清楚，或者之前已经回答过，我会道歉。我确实试过看，但我认为我的问题是我不知道自己做错了什么。

我目前有一个对象，如下：

var character = { name1: { info1: xx, info2: xx, ID: xx}, name2:  { info1: 
xx, info2: xx, ID: xx} }

我有一个人可以点击的图像，该图像具有与对象ID匹配的ID。

我尝试将点击属性（ID）转移到变量，解析它，然后用它来访问更完整的ID信息......就像这样：

var clickedOnId = $(this).attr("id");

function characterID() {
    var parseID = JSON.parse(clickedOnID)
    var accessID = character.name.parseID
    $(".div").html("<h2>" + accessID + "</h2>")
}

我知道点击正在记录ID（我已经在console.log＆＃39; ed），所以我知道点击是从图像中接收ID属性信息...所以问题必须要做我如何访问该对象。我也试过不解析它，但这不起作用。有没有人对我能做什么有任何建议？

谢谢！

Answer 1

JSON.parse()与此无关。只是一个简单的测试，看看点击的id是否与对象id匹配。

＆＃13;

var character = { 
   name1: { 
     info1: "x info", 
     info2: "more x info", 
     ID: "xx"
   }, 
   name2: {
     info1: "y data", 
     info2: "specific y info", 
     ID: "yy"
   }
};


$("div").on("click", function(){

  // Loop over objects
  for(var prop in character){

    // Test to see if we have an id match
    if(character[prop].ID === this.id){
        
        // Begin preparing output
        var ul = document.createElement("ul");
        
        // Loop over sub-object properties and produce output
        for(var subProp in character[prop]){
          var li = document.createElement("li");
          li.textContent = prop + "." + subProp + " = "  + character[prop][subProp]; 
          ul.appendChild(li);
        }
    
        $(".div").html(ul);

    }
  }
  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="yy">Try Me</div>
<div id="xx">Try Me</div>
<div class="div"></div>

＆＃13;

Answer 2

你想要实现的目标不是很清楚。

function characterID() {
    var accessID = character["name" + clickedOnID];
    $(".div").html("<h2>" + accessID + "</h2>")
}

但那可能会给你"<h2>[object Object]</h2>"。所以你可能想要$(".div").html("<h2>" + accessID.ID + "</h2>")或其他一些财产。

另外请记住，由于可访问性，点击图片并不是一个好主意。

Javascript - 如何使用单击功能访问对象的属性

2 个答案: