检索结果画面上对于关键字的highlight

来源:互联网 发布:多目标优化模型 编辑:程序博客网 时间:2024/06/05 23:00

html:

<head>区域:

①: 

  <style>
     .highlight {background-color: #FFFF88; }
   </style>

 

②:

 <script src="/js/jquery-1.10.2.js"></script>

 

③:

 <script>

 function highlight(searchText) { 
 
  clearSelection();

  var regExp = new RegExp('('+searchText+')', 'gi');
  
  $('h').each(function()
  {
   var html = $(this).html();
   
   var newHtml = html.replace(regExp, '<span class="highlight">$1</span>');
 
   $(this).html(newHtml); 

  });
  
 }
 
 function clearSelection() {

  $('h').each(function()
  {
   $(this).find('.highlight').each(function()
   { 
    $(this).replaceWith($(this).html()); 
   });
  });

 }

 </script>

 

<body>区域:

①:

・・・・・・

<h>${item.username}</h>

<h>${item.lastLogin?date("yyyy-mm-dd")}</h>

<h>${item.timeZone}</h>

<h>${item.regRegion}</h>

・・・・・・

0 0