2017-01-29 3 views
-1

У меня есть данные JSON как info.json.Ошибка при получении данных от объекта JSON

[ 


    {"employee": {"name":"A", "salary": "324423"}}, 

     {"employee": {"name":"B", "salary": "43111"}}, 

     {"employee": {"name":"C", "salary": "43434"}}, 

     {"employee": {"name":"D", "salary": "120000"}}, 



] 

и index.html в ссылка linklinklink

</body> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script> 
var item,$emp=$('#emp') ;$aa=$('a') ;$sal=$('#salary'); 
    $.ajax({ 
    url:"info.json", 
    success:function(data){ 
    item=data; 
    } 
      }) 

    $aa.click(function(){ 
     var index=$aa.index(this); 
     var 
     inf=item[index].employee; 
      $sal.text(inf.salary); 
     return false; 
    }) 

    </script>  

Я просто хочу, чтобы отобразить имя и зарплату сотрудника на кнопку мыши из JSON DATA в index.html:

  1. все одновременно в 1 link
  2. всего 4 отдельно в 4 ссылки

Но получить ошибки как:

enter image description here.

Я думаю, что это просто, но я новичок в AJAX. СПАСИБО ЗАРАНЕЕ

+0

Я рекомендую проверить разработчик сети инструменты вашего браузера, чтобы увидеть, есть ли на самом деле ответ от сервера или произошла ошибка. – mm759

+1

Почему вы включаете клик, когда не уверены, получили ли вы результаты? –

+0

вам нужно разобрать json, используя JSON.parse(). –

ответ

0
  1. Сначала вам нужно убедиться, что обработчик, прикрепленный после того, как данные вернулись с сервера
    1. секунд вам нужно удалить (,) после последнего сотрудника JSON.

это JSON: -

[ 
{"employee": {"name":"A", "salary": "324423"}}, 

    {"employee": {"name":"B", "salary": "43111"}}, 

    {"employee": {"name":"C", "salary": "43434"}}, 

    {"employee": {"name":"D", "salary": "120000"}} 
] 

это код: -

var item, $emp = $('#emp'); 
$aa = $('a'); 
$sal = $('#salary'); 
$.ajax({ 
url: "info.json", 
success: function(data) { 
    //item = data; 
    //handle click only after the data came back 
    handleClick(data); 
}, 
error:function(xhr,status,error){ 
    console.log(error); 
} 
}) 
var handleClick = function(item){ 
$aa.click(function() { 
var index = $aa.index(this); 
debugger; 
if (item) { 
    var 
    inf = item[index].employee; 
    $sal.text(inf.salary); 
    $emp.text(inf.name); 
} 
return false; 
    }) 
} 

Вот полный Demo

+0

Надеюсь, что решить ответ на ваш вопрос –

+0

yess, но каждый раз, когда он показывает, что отладчик приостановлен, нажмите F8.Я использую chrome –

+0

я удалил отладчик, Добавил обработку имен проверить демо –

1

ваш JSON есть лишняя запятая в последней строке, удалить

ваш код получает данные JSON, но не разбор его, используйте этот

$.ajax({ 
    url: "info.json", 
    success: function(data) { 
     item = JSON.parse(data); 
    } 
}) 

теперь у вас есть ты данные в пункт

Доступ к сведениям:

Количество сотрудников является item.length

первое имя работника item[0].employee.name

первая зарплата работника item[0].employee.salary

второе имя сотрудника является item[1].employee.name

второй заработной платы работник item[1].employee.salary

и так далее ...

+0

, что означает «JSON.parse (data)», и я не могу просто использовать «данные» –

+0

ajax вернет данные как строка, JSON.parse() преобразует данные в объект JSON –