PageAdmin网站内容管理系统(CMS)交流论坛

首页 » PageAdmin使用区 » 安装及使用交流 » 搜索结果关键词高亮怎么设置

李木木 - 2022/2/15 11:36:33

如题，搜索结果关键词高亮怎么设置，求大佬指教

xiyou - 2022/2/15 14:12:14

发你的搜素模板内容看看，哪里需要高亮显示？

李木木 - 2022/2/16 9:15:50

回复 2楼xiyou的帖子

1. @{
   
2.     int columnId = Html.CurrentColumnId();
   
3.     string kw = StringHelper.Format<string>(HttpContext.Current.Request.QueryString["kw"]);
   
4.     string[] pagePathArr = Html.PagePath().Split('/');
   
5.     int currentPage = StringHelper.Format<int>(Html.CustomViewParameter("page"));
   
6.     
   
7.     
   
8.     if (currentPage <= 0)
   
9.     {
   
10.         currentPage = 1;
    
11.     }
    
12.     PageInfo pageInfo = new PageInfo()
    
13.     {
    
14.         PageSize = 10,//每页显示10条数据
    
15.         CurrentPage = currentPage, //当前页码，系统预设
    
16.     
    
17.     };
    
18.     var dataList = Html.InfoDataList(new { Table = "news" ,OrderBy="thedate desc"},"title like @kw", new { kw = "%" + kw + "%" }, pageInfo);
    
19.     ViewBag.Path = "/news/Search/"; //PagebreakPartial分页文件用到
    
20. }
    
21. <div class="container padding-bottom-60">
    
22.     <ul class="breadcrumb">
    
23.         <li><a href="@Html.SiteUrl()"><span class="fa fa-home"> 首页</span></a></li>
    
24.         <li><a href="">文章搜索</a></li>
    
25. 
    
26.     </ul>
    
27.     <ul class="news-list padding-top-10">
    
28.              <li style="border-bottom: 0px solid #dddbdb;">
    
29.           <span>搜索</span>
    
30.           <span style="color:#db3636">"@kw"</span>
    
31.           <span>共找到</span>
    
32.           <span style="color:#db3636">"<%=RecordCount%>"</span>
    
33.           <span>篇文章</span>
    
34.         </li>
    
35.         @{int num = 0;
    
36.             foreach (var item in dataList)
    
37.             {
    
38.                 num++;
    
39.                 string url = Html.InfoDataUrl((int)item.ColumnId, (int)item.Id);
    
40.                 string date = item.Thedate.ToString("yyyy-MM-dd");
    
41. 
    
42.                 <li class="item">
    
43.                     <span class="title" style="background: url([img]http://129.0.12.91/Templates/CompanyDefault/images/5-1.png[/img]) no-repeat left center;">
    
44.                         <a href="@url" target="_blank" title="@item.Title">@item.Title</a>
    
45.                     </span>
    
46.                     <span class="date">@date</span>
    
47.                 </li>
    
48.             }
    
49.             if (num == 0)
    
50.             {
    
51.             
    
52.                 <li class="line-height-2 padding-bottom-20 padding-top-20" style="height: 300px;margin-left:500px;border-bottom: 0px solid #dddbdb;">
    
53.             <img class="img4" referrerpolicy="no-referrer" src="http://129.0.12.91/Templates/CompanyDefault/images/not found2.png">
    
54.                     <span class="word11">暂时没有找到匹配的记录</span>
    
55.             <span class="info7">请更换一个关键词重新搜索!</span>
    
56.                 </li>
    
57.             }
    
58.         }
    
59.     </ul>
    
60.      @Html.Partial("PagebreakPartial", pageInfo)
    
61. </div>
    
62. <script>
    
63.     $("#input-search").val("@kw");
    
64.     //$searchBtn.trigger("click");//触发搜索按钮，显示搜索框
    
65. </script>
    

复制代码

搜索关键词高亮

xiyou - 2022/2/16 10:23:10

<a href="@url" target="_blank" title="@item.Title">@item.Title</a>
改为
<a href="@url" target="_blank" title="@item.Title">@(item.Title.Replace(kw,"<strong>"+kw+"</strong>"))</a>

然后自己加个css样式控制strong标签高亮就可以了

李木木 - 2022/2/16 10:25:37

回复 4楼xiyou的帖子

好的！多谢！

李木木 - 2022/2/16 11:24:49

回复 4楼xiyou的帖子

strong.png(54.02 K)

2022/2/16 11:24:49

为什么是这样的效果

李木木 - 2022/2/16 15:34:22

回复 4楼xiyou的帖子

拜托拜托，再帮忙看看吧:t(

xiyou - 2022/2/16 15:51:44

替换后最外层加一个Html.Raw()，这个方法作用是禁止html转义

李木木 - 2022/2/16 16:16:19

回复 8楼xiyou的帖子

加到哪儿呀

青玄科技 - 2022/2/16 16:22:27

@Html.Raw(item.Title.Replace(kw,"<strong>"+kw+"</strong>")) 试试

李木木 - 2022/2/16 16:23:56

回复 10楼青玄科技的帖子

哦哦，好了！谢谢谢谢么么哒

lzghj - 2022/2/17 11:38:05

做个记号，有用

xuline - 2022/2/17 20:32:49

回复 2楼xiyou的帖子

请问我的搜索页面模板里，如果想加入“关键字”为黄色背景，应该在哪里如何修改？

1. @{
   
2.     PageInfo pageInfo = new PageInfo()
   
3.     {
   
4.         PageSize = 10,//每页显示10条数据
   
5.         CurrentPage = (int)ViewBag.CurrentPage //当前页码，系统预设
   
6.     };
   
7.     string kw = StringHelper.Format<string>(Request.QueryString["kw"]);
   
8. }
   
9. <section id="subcont">
   
10.     @Html.Partial("SubBannerPartial")
    
11.     <div class="wrapper ">
    
12.         <div class="clearfix">
    
13.             @Html.Partial("leftNavPartial")
    
14.         </div>
    
15.         <div class="c12 location mob_none">
    
16.             @Html.Partial("BreadcrumbPartial")
    
17.         </div>
    
18.         <!--预算类新闻列表-->
    
19.         <div class="c12 subnews_s">
    
20.             <ul>
    
21.                 @Html.Partial("NewsListModel", Html.InfoDataList(new { Table = "news" }, "title like @title", new { title = "%" + kw + "%" }, pageInfo))
    
22.             </ul>
    
23.             <div id="loading">
    
24.                 <section>
    
25.                     <div class="sk-three-bounce">
    
26.                         <div class="sk-bounce-1 sk-child"></div>
    
27.                         <div class="sk-bounce-2 sk-child"></div>
    
28.                         <div class="sk-bounce-3 sk-child"></div>
    
29.                     </div>
    
30.                 </section>
    
31.             </div>
    
32.         </div>
    
33.         <!--预算类新闻列表END-->
    
34.     </div>
    
35.     <div class="subtopbg"> </div>
    
36. </section>
    
37. <script type="text/javascript">
    
38.         var state = 0;
    
39.         var CurrentPage = 1;
    
40.         var $ul = $(".subnews_s").children("ul");
    
41.         var liLen = $ul.children("li").length;
    
42.         var $loading = $("#loading");
    
43.         $loading.data("on", true).hide();
    
44.         $(window).scroll(function () {
    
45.             if (!$loading.data("on")) {
    
46.                 setTimeout(function () { $loading.hide(); }, 800);
    
47.                 return;
    
48.             }
    
49.             if (@pageInfo.RecordCount> liLen && ($(window).scrollTop() + $(window).height()) >= ($(document).height() - 200))
    
50.             {
    
51.                 CurrentPage++;
    
52.                 $loading.data("on", false).fadeIn(800);
    
53.                 var json = Ajax({ type: "get", async: false, dataType: "html", url: "/SearchHtml/?model=NewsListModel&title=@(Request.QueryString["kw"])&PageSize=@(pageInfo.PageSize)&CurrentPage=" + CurrentPage, }, function (data) {
    
54.                     var time = setTimeout(function () {
    
55.                         $ul.append(data);
    
56.                         liLen = $ul.children("li").length;
    
57.                         $loading.data("on", true).fadeOut();
    
58.                         sweetTitles.init();
    
59.                         clearTimeout(time);
    
60.                     }, 800)
    
61.                 });
    
62.             }
    
63.             if (@pageInfo.RecordCount==liLen && ($(window).scrollTop() + $(window).height()) >= ($(document).height() - 200)) {
    
64.                 if ($loading.data("on")) {
    
65.                     Msg("已加载完毕！");
    
66.                     $loading.data("on", false);
    
67.                 }
    
68.             }
    
69.         });
    
70. </script>
    

复制代码

xiyou - 2022/2/18 8:41:03

/SearchHtml这个路由的模板文件修改找，感觉是通过自定义路由做的。

xuline - 2022/2/18 9:03:40

1. <a href="@url" target="_blank" title="@item.Title">@Html.Raw(item.Title.Replace(kw,"<strong>"+kw+"</strong>"))</a>
   
2. 
   
3. <span style="background-color: #FFFF00;"></span>
   

复制代码

xuline - 2022/2/18 14:27:39

回复 14楼xiyou的帖子

1. @{
   
2.     Layout = null;
   
3.     int pageSize = StringHelper.Format<int>(Request.QueryString["PageSize"]);
   
4.     string title = StringHelper.Format<string>(Request.QueryString["Title"]);
   
5.     string model = StringHelper.Format<string>(Request.QueryString["model"]);
   
6.     PageInfo pageInfo = new PageInfo()
   
7.     {
   
8.         PageSize = pageSize,//每页显示10条数据
   
9.         CurrentPage = StringHelper.Format<int>(Request.QueryString["CurrentPage"]) //当前页码，系统预设
   
10.     };
    
11. }
    
12. @Html.Partial(model, Html.InfoDataList(new { Table = "news" }, "title like @title", new { title = "%" + title + "%" }, pageInfo))
    

复制代码

xuline - 2022/2/18 16:05:53

回复 14楼xiyou的帖子

请问xiyou，看16楼的路由代码，要高亮黄色背景底，需要怎么修改呢？

xiyou - 2022/2/18 16:11:54

这个模板文件通过包含子文件加载出来的，html部分应该在 shared或model目录里面

xuline - 2022/2/18 16:53:42

回复 18楼xiyou的帖子
请问是这个文件吗？如果是那要怎么改呢？只要把搜索结果的所有“关键字”加黄色背景就可以。
/Model/NewsListModel.cshtml

1. @{
   
2.     IEnumerable<dynamic> dataList = Model;
   
3. }
   
4. @if (dataList.Count() > 0)
   
5. {
   
6.     int i = 1;
   
7.     foreach (var item in dataList)
   
8.     {
   
9.         string url = Html.InfoDataUrl((int)item.ColumnId, (int)item.Id);
   
10.         string date = item.Thedate.ToString("yyyy/MM/dd");
    
11.         string target = "_self";
    
12.         string title = item.Title;
    
13.         if (!url.Contains(item.Id.ToString() + ".cshtml"))
    
14.         {
    
15.             target = "_blank";
    
16.             title = "【外链】" + title;
    
17.         }
    
18.         url += "#wrapper_n";
    
19.         <li><a href="@url" title="@item.Title" target="@target">@title<span>@date</span></a></li>
    
20.         if (i % 5 == 0)
    
21.         {
    
22.             <hr>
    
23.         }
    
24.         i++;
    
25.     }
    
26. }
    

复制代码

1

查看完整版本: 搜索结果关键词高亮怎么设置

Powered by Discuz!NT Archiver 3.9.913 2001-2025 Comsenz Inc.