javascript - 如何在同一个 jQuery 函数中使用两个追加?
问题描述
我有一个 jQuery 搜索功能,我想在开始搜索时首先显示一个 HTML 块,显示标题“搜索结果”。然后我想在第一个块中添加另一个 ID 为“entitiesNav”的 HTML 块,并附加。这就是我尝试过的,但没有用,请问我该怎么办?
<div id="searchRes>
<div class="media post-block m-b-xs-30" id="entitiesNav">
</div>
</div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
var searchRequest = null;
$("#search").keyup(function() {
var minlength = 1;
var that = this;
var value = $(this).val();
var searchResult = $("#searchRes").html('');
var entitySelector = $("#entitiesNav").html('');
if (value.length >= minlength ) {
searchResult.append('<section class="section-gap section-gap-top__with-text trending-stories" >' +
'<div class="container">\n' +
' <div class="section-title m-b-xs-40">\n' +
' <h2 class="axil-title">Search Result</h2>\n' +
'\n' +
' </div>\n' +
' <div class="row">\n' +
' <div class="col-lg-6">'+'</div> <!-- End of .col-lg-6 -->\n' +
'\t\t\t\t\t</div>\n' +
'\t\t\t\t\t<!-- End of .row -->\n' +
'\t\t\t\t</div>\n' +
'\t\t\t\t<!-- End of .container -->\n' +
'\t\t\t</section>'
) ;
if (searchRequest != null)
searchRequest.abort();
searchRequest = $.ajax({
type: "GET",
url: "{{ path('search_ajax') }}",
data: {
'q' : value
},
dataType: "text",
success: function(msg){
//we need to check if the value is the same
if (value===$(that).val()) {
var result = JSON.parse(msg);
$.each(result, function(key, arr) {
$.each(arr, function(id, value) {
if (key === 'articles') {
if (id !== 'error') {
console.log(value[1]);
entitySelector.appendTo(searchResult).append('<a href="/show_article'+id+'">'+'<img class=" m-r-xs-30" src="'+value[0]+'" >'+'</a>'+'<h3 class="axil-post-title hover-line hover-line">'+value[1]+'</h3>');
} else {
entitySelector.append('<li class="errorLi">'+value+'</li>');
}
}
});
});
}
}
});
}
});
});
</script>
解决方案
推荐阅读
- angular - 使用 Asp.Net Boilerplate 5.5.0.0 仅允许每个用户 1 个角色
- c++ - std::shared_ptr 如何被释放?
- python - 类似的 pyspark 逻辑在数据框中返回不同的行数
- android - 在 Android Studio(Kotlin)中单击按钮时更改 TextView 文本
- javascript - 拖放图像和 CSS
- lua - 获取表中表的值
- git - 如何在 git commit 中打印更改的行?
- javascript - React 中的模板字符串
- angular - Angular 库编译时错误“违反不变量:没有格式路径或格式”
- javascript - 我无法从 facebook api 图形工具获取短用户令牌