Question

我正在使用Facebook Javascript API。我想创建这样的东西：

1. Album Name [show/hide]

Album details

2. Album Name [show/hide]

Album details

3. Album Name [show/hide]

Album details

首先我检索了专辑列表
相册名称旁边会有一个按钮，可以使用jQuery切换（显示/隐藏）相册的详细信息。
相册详细信息放入带有特定ID的p标签（“album1”，“album2”等...）
使用jQuery切换特定ID。
但是，在FB.api内创建的按钮in1无法切换。
FB.api之外的另一个按钮out1可以切换。

QNS：为什么FB.api中的按钮无法进行切换？

我只想为每张专辑制作一个特定按钮，以便我可以专门切换每张专辑的详细信息。

以下部分代码：

<script>
    function albums()
    {

    FB.api('me/albums/', function(response) {
      for (var i=0; i<response.data.length; i++) {
        var album = response.data[i]; // each album

        // Album Name
        var albumName = response.data[i].name;
        var para = document.createElement('p');
        var node = document.createTextNode(albumName);
        para.appendChild(node);
        document.body.appendChild(para); // put p into body of document

        // Button
        var btn = document.createElement("button");
        btn.id = "in"+(i+1);
        var t = document.createTextNode("inside");      
        btn.appendChild(t);
        document.body.appendChild(btn);  


        // Album Details
        var para = document.createElement('p');
        para.id = "album"+(i+1);
        var node = document.createTextNode("Album details");
        para.appendChild(node);
        document.body.appendChild(para);
        }   


    });
    }
</script>   

<script src="//code.jquery.com/jquery-1.10.2.js"></script>

<button id="out1">out1</button>
<script>
jQuery( "#out1" ).click(function() {
  jQuery( "#album1" ).toggle();
});
jQuery( "#in1" ).click(function() {
  jQuery( "#album1" ).toggle();
});
</script>

Answer 1

您正尝试在异步加载的元素上放置一个偶数侦听器。意思是，该按钮尚不存在。确保你知道异步意味着什么，这对于JavaScript开发人员来说非常重要，特别是在使用Facebook JS SDK时。在创建/显示按钮后立即向按钮添加事件监听器。

另外，请记住，您只会在第一个按钮上放置一个事件监听器。

在Facebook API中创建按钮以显示/隐藏（切换）

1 个答案: