Javascript 通过jquery get函数获取html文件。德扬戈

在我的django应用程序中，我显示用户facebook好友列表。为了每10分钟刷新一次，我将这个列表放在另一个视图和html中，并使用get请求获取它，并将其显示在我不想显示的页面上

下面是get_fb_friends.html文件，我在其中有朋友列表：（这是与我创建的视图关联的html文件。这是我不想在显示给用户的页面上显示的列表）：

{%组中的朋友%}
{{friend.name}
{%endfor%}

以及如何在模板中导入：（这是我不想为用户显示列表的页面）

JS:
setInterval（函数（）{
$.get（'/mysite/get_fb_friends/'，函数（数据）{
$（'.get_fb_friends'）.html（数据）；
});
}, 600000);
返回jQuery（a）.text（）.toUpperCase（）.indexOf（m[3].toUpperCase（））>=0；
};
$（函数（）{
$（'#searchbox'）。在（'keyup'，function（）上{
var w=$（this.val（）；
如果（w）{
$（'#friendlist li'）.hide（）；
$（“#好友列表li:Contains（“+w+”））。show（）；
}否则{
$（'#friendlist li'）.show（）；
}
});
});
HTML:

然后，我不想在这个列表的顶部包括一个搜索栏，以便用户能够搜索他想要的朋友。因此，在我的get_fb_friends.html中，我添加了：

  HTML:
    <input id="searchbox" type="text" placeholder="Search" />    
    <ul id="friendlist">
    {% for friend in group %}
    <li>{{ friend.name }} </li>
    {% endfor %}

HTML：

{组%中的朋友为%0}
{{friend.name}
{%endfor%}

如果我在www.mysite/get_fb_fb_friends页面上使用该搜索栏，则该搜索栏将非常有效，但一旦通过jquery get请求获取该搜索栏（即在我不想为用户显示该搜索栏的页面上），该搜索栏将不再有效；我打了一个字母，所有的名字都消失了

看起来，当我通过jquery get函数获取html文件时，它没有在jquery函数中保留我需要的'li'

知道发生了什么事吗

我希望我的问题很清楚，谢谢你的帮助

编辑：

我的主页：

 HTML:
 <div class="friendlist" id="friendlist"> 


 JS:

 $.get('/mysite/get_fb_friends/', function(data) {
    $('.friendlist').html($(data).find($('#friendlist').html()));
    });

 return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
    };

   $(function() {
    $('#searchbox').on('keyup', function() {
      var w = $(this).val();
       if (w) {
        $('#friendlist li').hide();
        $('#friendlist li:Contains('+w+')').show();
      } else {
        $('#friendlist li').show();                  
     }
     });
     });

HTML：
JS:
$.get（'/mysite/get_fb_friends/'，函数（数据）{
$（'.friendlist'）.html（$（数据）.find（$（'.friendlist'）.html（））；
});
返回jQuery（a）.text（）.toUpperCase（）.indexOf（m[3].toUpperCase（））>=0；
};
$（函数（）{
$（'#searchbox'）。在（'keyup'，function（）上{
var w=$（this.val（）；
如果（w）{
$（'#friendlist li'）.hide（）；
$（“#好友列表li:Contains（“+w+”））。show（）；
}否则{
$（'#friendlist li'）.show（）；
}
});
});

我的远程页面：

 HTML:
 <input id="searchbox" type="text" placeholder="Search" />    
 <ul id="friendlist" class="friendlist">

  {% for friend in group %}
    <li>{{ friend.name }}</li>
  {% endfor %}

HTML：

{组%中的朋友为%0}
{{friend.name}
{%endfor%}

我相信您真的只想更新列表内容，而不是每次刷新都要替换

输入和完整列表本身

在这种情况下，您需要主页中的所有JS，将远程文件的输出更改为只发送回
LI
标记，并将它们插入到新的目标
好友列表中。此插入可以是完全替换，也可以只是附加新找到的名称。不确定你的应用程序打算如何处理这方面的问题

您还可以添加一个标志，当用户对输入进行任何过滤时，不进行ajax调用

旗帜可能是这样的

$('#searchbox').on('focus blur', function(){
   $(this).toggleClass('active')
})

然后在
setInterval

setInterval(function(){
        if( ! $('#searchbox').hasClass('filter') ){
            $('#friendlist').load('/mysite/get_fb_friends/')
       }
    }, 600000);

对于什么html/js在什么文件中，以什么顺序，这是令人困惑的。可以简化
$。获取
$（'.get_fb_fb_friends'）。加载（'/mysite/get_fb_fb_friends/'）但这不能解决任何其他问题OK，谢谢你的提示。为了让问题更清楚，我对我的问题进行了编辑，希望能有所帮助。谢谢你的回答。我需要完全替换，因为我根据朋友的活动（活动、空闲或脱机）对他们进行排序。所以如果我明白你说的话，我必须把搜索栏（html和JS）放在主页上。然后我需要更改jqueryget请求，以便只获取LI标记。但我必须承认，我不知道如何请求get请求才能得到它。您能给我一个关于jquery get函数的提示或一个好的教程吗？谢谢您可以将远程页面的输出更改为仅发送LI标记吗？如果没有，远程页面可以在主页中的ajax success中解析，也注意到
$（“#friendlist”）.hide（）
应该是
$（'#friendlist li'）。hide（）并且可能是根本看不到任何东西的根本原因。您正在隐藏父对象，并且任何时候都不能显示隐藏父对象的子对象。我真的不知道如何才能只发送LI标记。你能帮我吗？好的，可以这样做。$get（'/mysite/get#fb#u friends/'，function（data）{$（'#friendslist'）.html（$（data）.find（$（'.#friendslist'）.html（）；）；
这将解析返回的页面，并且只拉出LI标记并在主页中替换它们
$('#searchbox').on('focus blur', function(){
   $(this).toggleClass('active')
})

setInterval(function(){
        if( ! $('#searchbox').hasClass('filter') ){
            $('#friendlist').load('/mysite/get_fb_friends/')
       }
    }, 600000);