Question

我有一个对象的字符串，我想显示该名称，一旦点击了不同的链接，它将只显示与其相关的信息。因此，如果我单击chunk1，它将只显示一次点击的地址。我知道我需要以某种方式为每个href附加一个ID标签，但我不能让它工作。任何想法如何让它正常运作。

$(document).ready(function () {

var jsonp = '[{"Name":"Chunk1", "address":"99 west blvd"},{"Name":"Chunk2","address":"xavier holway park 2344" }]';
    // var jsonp2 = '[{"address":"123"},{"address":"456"}]';
    var sName = '';
    var obj = $.parseJSON(jsonp);
    //var obj1 = $.parseJSON(jsonp2);
    $.each(obj, function () {
        sName += '<p>';
        sName += '<a href="#">';
        sName += this['Name'] + "<br/>";
        sName += '</a>';
        sName += this['address'] + "<br/>";
        sName += '</p>';
     
        

    });

$('span').html(sName);
$('a').click(function (obj) {
alert("this");

});
  
});

body {
    font-family: Arial;
    font-size: 12pt;
    padding : 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<span></span>

Answer 1

您需要使用默认隐藏的span或p标记来包装地址，然后为名称链接创建一个类以将其全部抓取并将click事件绑定到其中切换下一个范围的可见性以查看地址：

$(document).ready(function () {

var jsonp = '[{"Name":"Chunk1", "address":"99 west blvd"},{"Name":"Chunk2","address":"xavier holway park 2344" }]';
    // var jsonp2 = '[{"address":"123"},{"address":"456"}]';
    var sName = '';
    var obj = $.parseJSON(jsonp);
    //var obj1 = $.parseJSON(jsonp2);
    $.each(obj, function () {
        sName += '<p>';
        sName += '<a href="#" class="nameLink">';
        sName += this['Name'] + "<br/>";
        sName += '</a><span style="display:none">';
        sName += this['address'] + "</span><br/>";
        sName += '</p>';
     
        

    });

$('span').html(sName);
   /* $('a').click(function (obj) {
alert("this");

});*/

$(".nameLink").click(function(){

$(this).next().toggle();
});
  
});

body {
    font-family: Arial;
    font-size: 12pt;
    padding : 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<span></span>

显示/隐藏对象

1 个答案: