與輸入值相關的對象的警報值屬性

Question

我無法警告對應於區域標記ID的對象值。

我的代碼，

  $(document).ready(function() { 
      $(".wholecirclewrapper area").click(function(){  
       if($(this).hasClass("active")) {   
        return false; 
       }  
       var choice = $(this).attr("id");  
       $.each(results.States, function(i, item) { 
        var st=results.States[i].Name; 
        if(choice==st) 
        { 
         alert(results.States[i].ISHI); 
        } 
       }); 

      }); 

     }); 

我的HTML代碼

  <div id="mapdiv"> 
     <img src="india.gif" alt="India" usemap="#indiamap" /> 
     <map name="indiamap" class="wholecirclewrapper"> 
      <area class="specificshelfdiv1" id="AndraPradesh" shape="rect" coords="0,0,82,126" href="#" /> 
      <area class="specificshelfdiv2" id="ArunachalPradesh" shape="circle" coords="90,58,3" href="#" /> 
      <area class="specificshelfdiv3" id="Assam" shape="circle" coords="124,58,8" href="#" />  
     </map> 
    </div> 

我的外部JSON看起來像

 var results={"States":[ 
     { "Name" : "AndraPradesh" , "ISHI" : "19.5 (Serious)" ,"Literacy rate" : "67.7" ,"Population rate" : "84,665,533" ,"NFHS" : "29.8" ,"Tap water" : "69.9"}, 
     { "Name" : "ArunachalPradesh" , "ISHI" : "Not estimated" ,"Literacy rate" : "67" ,"Population rate" : "1,382,611" ,"NFHS" : "29.6" ,"Tap water" : "65.5"}, 
     { "Name" : "Assam" , "ISHI" : "19.8 (Serious)" ,"Literacy rate" : "73.2" ,"Population rate" : "31,169,272" ,"NFHS" : "35.8" ,"Tap water" : "10.5"} 
    ] 
    }; 

我正在通過

  <script src="json_states.json" type="text/javascript"> </script> 

調用JSON

我做錯了什麼？

Answer 1

首先嚐試在Chrome中按F12與的console.log

console.log(results.States[i].ISHI); 

更換警報然後，轉到控制檯並查看是否打印值。 根據經驗，總是使用console.log而不是alert，因爲它更強大，更易於使用。

更新：

嘗試加載以下順序的腳本文件頭：

<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script> 
<script src="json_states.json"></script> 
<script> 
    $(document).ready(function() { 
... 
</script> 

也看到這個例子中，我寫道：http://radulescu.me/overflow/1/

Answer 2

您的代碼似乎是工作this jsFiddle example在這裏。我添加了另一個元素<p id="result"></p>，而不是提醒我正在設置此元素的.text()，這很好。試試這個方法而不是alert，看看你得到了什麼。

$(".wholecirclewrapper area").click(function() { 
    if ($(this).hasClass("active")) { 
     return false; 
    } 

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

    $.each(results.States, function(i, item) { 
     var st = results.States[i].Name; 
     if (choice == st) { 
      $("#result").text(results.States[i].ISHI); 
     } 
    }); 
}); 

您是否使用某種彈出式窗口攔截器，因爲這些阻止器會阻止某些腳本執行。如果沒有，那麼我建議你在你的瀏覽器調試環境中檢查腳本錯誤。

---

編輯 - 如果你從外部文件加載，而不是把它放置在頭的JSON，你嘗試加載它是這樣的：

$.getJSON('json_states.json', function(data) { 
    var results = data; 

    // do the rest of your script here 
}); 

Answer 3

它被說3次已經，但是因爲你似乎無視它，或者沒有理解，我會再次發佈它。

var results={"States":[ 
    { "Name" : "AndraPradesh" , "ISHI" : "19.5 (Serious)" ,"Literacy rate" : "67.7" ,"Population rate" : "84,665,533" ,"NFHS" : "29.8" ,"Tap water" : "69.9"}, 
    { "Name" : "ArunachalPradesh" , "ISHI" : "Not estimated" ,"Literacy rate" : "67" ,"Population rate" : "1,382,611" ,"NFHS" : "29.6" ,"Tap water" : "65.5"}, 
    { "Name" : "Assam" , "ISHI" : "19.8 (Serious)" ,"Literacy rate" : "73.2" ,"Population rate" : "31,169,272" ,"NFHS" : "35.8" ,"Tap water" : "10.5"} 
] 
}; 

不是JSON。它是一個Javascript對象。

JSON只會是這樣的：

{"States":[ 
    { "Name" : "AndraPradesh" , "ISHI" : "19.5 (Serious)" ,"Literacy rate" : "67.7" ,"Population rate" : "84,665,533" ,"NFHS" : "29.8" ,"Tap water" : "69.9"}, 
    { "Name" : "ArunachalPradesh" , "ISHI" : "Not estimated" ,"Literacy rate" : "67" ,"Population rate" : "1,382,611" ,"NFHS" : "29.6" ,"Tap water" : "65.5"}, 
    { "Name" : "Assam" , "ISHI" : "19.8 (Serious)" ,"Literacy rate" : "73.2" ,"Population rate" : "31,169,272" ,"NFHS" : "35.8" ,"Tap water" : "10.5"} 
]} 

林不知道，如果以.json文件擴展名會導致與任何瀏覽器的問題，但如果你的定義文件中的變量，它應該只是.js文件。 ..因爲那就是它的原因。