Jquery追加不在函数之外工作

时间:2015-08-04 13:20:46

标签: javascript jquery html append

您好我想将组ID添加到网页的开头,我试图将其附加到div" test",然后添加一个空格 - 允许它从yammer API中提取数据,然后循环遍历包含组ID的分隔。任何人都可以告诉我为什么它会在回调中打印到网页但不在回调之外?谢谢:))

{{#each order}}

  {{#each (collection this)}}
    {{this.title}}
  {{/each}}

{{/each}}

3 个答案:

答案 0 :(得分:2)

因为您的脚本无法找到$('#test') div。由于您没有为.ready()添加任何document事件块,因此脚本会在$('#test') div出现之前执行。

所以你需要将你的代码包装在doc ready块中:

$(function(){
   var page = 1;
   var groupIDs = [4271656,5896212,1188700];
   var n=0;

   while (n< groupIDs.length){

      $('#test').append("Group ID:" + "WHY WON'T YOU APPEND" + "<br/>");  

      getYammerJSON(page);

    function getData(returnData){
        $.each(returnData.users, function(key, value){
            if(value.email != undefined){
                $('#test').append(value.email + "<br/>");
            }
        });
    }

    function getYammerJSON(page){
        $.get("https://www.yammer.com/api/v1/users/in_group/" + groupIDs[n] + ".json?page=" + page, function(returnData) {
            getData(returnData);
            if(!returnData.more_available === true){
                return false;
            }
            else {
                page++;
                getYammerJSON(page);
            }
        });
    }
    n++;
    }
}); 

编辑:

您可以在此处移动append

function getData(returnData){
        $.each(returnData.users, function(key, value){
            if(value.email != undefined){
                $('#test').append(value.email + "<br/>");
                $('#test').append("Group ID:" + "WHY WON'T YOU APPEND" + "<br/>"); // <----move it here.
            }
        });
    }

答案 1 :(得分:0)

在页面底部编写脚本或将测试div放在顶部。 你甚至在标记渲染之前运行你的js代码...它不会找到div所以它不会附加任何东西

不应该像这样

    <script>
$("#test").append("ghgh");
</script>

<div id = "test"> jj </div>

它应该像这样

<div id = "test"> jj </div>
    <script>
$("#test").append("ghgh");

</script>

编辑1: 如果你真的想先运行你的代码然后将所有文本追加到字符串类型变量中,那么最后只需将它添加到div的值。

编辑2:

喜欢这个

  <script>
for( condtion counter etc)
{
    str_var+= "your text";
 }   
    </script>

然后运行你的srcipt

$("#test").text(str_var); or $("#test").val(str_var); or append 

答案 2 :(得分:0)

解决方案:

1

<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<script>
$(function(){
var page = 1;
var groupIDs = [4271656,5896212,1188700];
var n=0;

while (n< groupIDs.length){

    $('#test').append("Group ID:" + "WHY WON'T YOU APPEND" + "<br/>");  

    getYammerJSON(page);

    function getData(returnData){
        $.each(returnData.users, function(key, value){
            if(value.email != undefined){
                $('#test').append(value.email + "<br/>");
            }
        });
    }

    function getYammerJSON(page){
        $.get("https://www.yammer.com/api/v1/users/in_group/" + groupIDs[n] + ".json?page=" + page, function(returnData) {
            getData(returnData);
            if(!returnData.more_available === true){
                return false;
            }
            else {
                page++;
                getYammerJSON(page);
            }
        });
    }
    n++;
   }
});
</script>   
</head>
<body>
    <div id="test">User Emails in Yammer Group IDs</div>
</body>

2

<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
</head>
<body>
    <div id="test">User Emails in Yammer Group IDs</div>
  
  
  <script>
var $ = jQuery;
var page = 1;
var groupIDs = [4271656,5896212,1188700];
var n=0;

while (n< groupIDs.length){

    $('#test').append("Group ID:" + "WHY WON'T YOU APPEND" + "<br/>");  

    getYammerJSON(page);

    function getData(returnData){
        $.each(returnData.users, function(key, value){
            if(value.email != undefined){
                $('#test').append(value.email + "<br/>");
            }
        });
    }

    function getYammerJSON(page){
        $.get("https://www.yammer.com/api/v1/users/in_group/" + groupIDs[n] + ".json?page=" + page, function(returnData) {
            getData(returnData);
            if(!returnData.more_available === true){
                return false;
            }
            else {
                page++;
                getYammerJSON(page);
            }
        });
    }
    n++;
   }
</script>  
  
</body>
</html>