Javascript - 如何通過點擊功能訪問對象的屬性

這是我在stackoverflow上的第一篇文章，所以如果我的問題不清楚，或者以前已經回答，我很抱歉。我確實試圖尋找，但我認爲我的問題是我不知道我做錯了什麼。Javascript - 如何通過點擊功能訪問對象的屬性

我現在有一個對象，像這樣：

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

我有一個形象，一個人可以點擊，並且圖像具有匹配的對象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'ed它），所以我知道點擊是從圖像接收ID屬性信息...所以這個問題與我如何訪問該對象。我試過不解析它，但那不起作用。有人對我能做什麼有任何建議嗎？

謝謝！

來源

2017-06-16 Hyperionvii

是它與json中的'character.name'有關，你實際上有name1，name2等。 –

JSON.parse()在這裏沒有關係。只需簡單測試一下，看點擊的id是否與對象id匹配。

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); 
 

 
    } 
 
    } 
 
    
 
});

<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>

來源

2017-06-16 17:48:44

這非常有幫助。謝謝！！！ – Hyperionvii

不要忘記投票並標記爲答案。祝你好運。 –

它不是很清楚你想才達到的。

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

但是，這將有可能給你"<h2>[object Object]</h2>"。所以你可能想要$(".div").html("<h2>" + accessID.ID + "</h2>")或其他一些財產。

還請記住，點擊圖像不是一個非常好的主意，因爲可訪問性。

來源

2017-06-16 17:49:51 pethel

Javascript - 如何通過點擊功能訪問對象的屬性

回答

相關問題