Question

我从json文件中获取信息并将其显示为链接。我希望能够在点击链接时隐藏并显示div。

这是我的代码。

$(document).ready(function() {

    $.getJSON('example.json', function(data) {
         var link = '';
         $.each(data.example, function(key, value) {

         	link += "<li><a href='" +('#newuser')+ "'>"+ value.name +"</a></li>";

       $('#user').append(output);
    });

    $("a href").click(function(){
        $(".main").hide();
      $(".main2").show();
    });
});

Answer 1

观察：

您所指的$('#user').append(output);已过时未知的输出变量。
您的('#newuser')只会创建具有相同ID的新链接如果您需要，您可能希望拥有唯一的ID。
如果您可以将clik事件绑定到类/ ID，而不是a href，那么它将使您的代码更清晰。
点击第一个链接，看看它是否符合摘要。

＆＃13;

var testFunc = function() {
  $.getJSON('https://jsonplaceholder.typicode.com/users', function(data) {
    var html = "";
    $.each(data, function(key, val) {
      html += "<li><a href= '#' class= 'linkClicked'>" + val.username + "</li>";
    });
    $('#user').append(html);
    $(".linkClicked").click(function() {
      $(".main").hide();
      $(".main2").show();
    });
  });
}

testFunc();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <ul id="user">

  </ul>
  <div class="main">This is the content to be hidden</div>
  <div class="main2">This is the content to be shown</div>
</div>

＆＃13;

使用json数据从链接打开和关闭div

1 个答案: