如何解决尝试根据输入是否包含文本node.js把手来隐藏/显示局部
所以我有一个页面。有一个搜索栏。如果搜索栏没有输入文本,则页面显示两个部分,一个用于精选应用程序,一个用于最受欢迎的部分。但是如果有人根本没有在搜索栏中输入任何文本,则精选应用程序和最受欢迎的应用程序部分将消失,并且显示搜索结果部分。相反,发生的事情既不是局部加载。应该有一个大空白。
我尝试使用jQuery进行此操作,但没有运气。所以现在我回到尝试使用动态局部函数的地方,但是也没有运气。如果只能使用jQuery这样的功能,请告诉我。
我曾经短暂地尝试使用车把帮助器,但是我没有将其链接到input id="searchApps"
元素而不会引发错误,因为它一直说searchApps
是未定义的。
index.hbs(如果缺少任何div,则原因是它只是代码的一部分)
<div class="col-2 offset-1">
<div class="column-side">
<div class="sidebar">
<input id="searchApps" type="text" placeholder="Search apps...">
{{!-- so once someone types the first character here the searchResults partial should render. and it should be dynamic so results should further refine with each additional character typed--}}
{{>sidebar}}
</div>
</div>
</div>
{{#if 'searchApps.length === 0'}}
<div id="searchResultsHomePage">
<div class="col-7 offset-1">
{{>searchResults}}
</div>
</div>
{{else}}
<div id="homePageNoSearch">
<div class="col-7 offset-1">
{{>featuredApps}}
</div>
<div class="most-popular-grid">
{{>mostPopularApps}}
</div>
</div>
{{/if}}
这是我在</body>
标记之前的index.hbs文件中尝试过的jQuery
<script type="text/javascript">
$('#searchApps').on('change',function(){
if ($(this).val() == ""){
<div id="homePageNoSearch">
<div class="col-7 offset-1">
{{>featuredApps}}
</div>
<div class="most-popular-grid">
{{>mostPopularApps}}
</div>
</div>
} else {
<div id="searchResultsHomePage">
<div class="col-7 offset-1">
{{>searchResults}}
</div>
</div>
}
});
</script>
所以有人知道我该怎么做吗?
谢谢
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。