`
sunfengcheng
  • 浏览: 183792 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

动态的查询并且高亮度显示

阅读更多
[size=x-large]向让你的页面中查到的文本显示成高亮显示吗?那就请和我一起来做下去。

使用 observe_field  辅助方法来连续发送 ajax 查找请求到服务器。

我们先来创建一个  数据库迁移。
db/migrate/001_create_articles.rb:

class CreateArticles < ActiveRecord::Migration
  def self.up
    create_table :articles do |t|
      t.column :title, :string
      t.column :body, :text
    end
  end

  def self.down
    drop_table :articles
  end
end


还需要将 Prototype JavaScript  库包含进去 通过创建下面的局部模版。

app/views/layouts/search.rhtml:

<html>
<head>
  <title>Search</title>
  <%= javascript_include_tag :defaults %>
  <style type="text/css">
    #results {
      font-weight: bold;
      font-size: large;
      position: relative;
      background-color: #ffc;
      margin-top: 4px;
      padding: 2px;
    }
  </style> 
</head>
<body>

  <%= yield %>

</body>
</html>

应用程序的index  视图 使用 Prototype JavaScript  辅助方法  observe_field. 定义一个观测字段, 这个模版还包括了用来存储查询解果的div 标签。
app/views/search/index.rhtml:

<h1>Search</h1>

<input type="text" id="search">

<%= observe_field("search", :frequency => 1,
                            :update => "content",
                            :url => { :action => "highlight"}) %>

<div id="content">
  <%= render :partial => "search_results", 
             :locals => { :search_text => @article } %>
</div>


在你的  Search Controller 里写这样的代码  处理要搜索的内容。
app/controllers/search_controller.rb:

class SearchController < ApplicationController

  def index
  end

  def highlight
    @search_text = request.raw_post || request.query_string
    @article = Article.find :first,
                     :conditions => ["body like ?", "%#{@search_text}%"]
                            
    render :partial => "search_results", 
           :locals => { :search_text => @search_text, 
                        :article_body => @article.respond_to?('body') ?
                                         @article.body : "" }
  end
end


最后查询结果的局部模版之需要简单的调用 highlight 辅助方法就是了。
app/views/search/_search_results.rhtml:

<p>
  <%= highlight(article_body, search_text, 
      '<a href="http://en.wikipedia.org?search=\1" id="results" 
          title="Search Wikipedia for \1">\1</a>') %>
</p>
[/size]
3
2
分享到:
评论

相关推荐

    数码管静态显示和动态显示原理PPT学习教案.pptx

    动态显示电路图可以显示数字、字母和其他符号,并且可以实现亮度较高较稳定的显示。 74HC573锁存器:74HC573锁存器是一种常用的锁存器,用于存储和输出数据。74HC573锁存器可以用于数码管显示电路中。

    如何实现LED点阵显示屏的动态显示和控制

    它广泛应用在户外媒体、军事、车站、宾馆、体育场馆、新闻、金融证券、广告以及交通等多个行业,主要是由于它具有色彩丰富、亮度高、动态范围广、寿命长、工作稳定可靠等特点。然而,随着技术的进步和需求的增加,...

    WinMerge会将两个文件内容做比对,并在相异之处以高亮度的方式显示,

    WinMerge会将两个文件内容做比对,并在相异之处以高亮度的方式显示,让使用者可以很快的查知,并且您可以直接让左方的文件内容直接覆盖至右方,或者反过来也可,这对需要常常修改文件内容的朋友来说,会是相当便利的...

    显示/光电技术中的基于高亮度LED在照明中的应用

    此间,由于大型照明光源电气公司的介入,例如PHILIPS和OSRAM,高亮度白光LED的光效取得了突破性的改进,并且迅速地开始进入普通照明的应用领域。目前,高亮度白光LED的光效在良好的散热条件下,已经超越了荧光灯的...

    基于C51的4位数码管动态显示程序

    【标题】"基于C51的4位数码管动态显示程序"主要介绍的是如何使用C51编程语言来实现4位数码管的动态显示功能,这个程序特别适用于STC系列的单片机,并且已经在仿真环境中成功运行。下面将详细阐述相关知识点。 一、...

    在高亮度LHC下使用轻希格诺振荡器从Wino对生产中获得的同符号diboson签名的各个方面

    (ii)设计更有效的切割方法以成功应对这些较大的背景 并通过这些切割确定Winos的发现范围和排除范围,强调针对HL-LHC更新​​的3 ab-1的综合光度目标的预测,并且(iii)强调此通道在没有高加诺质量统一的自然模型...

    显示/光电技术中的超高亮度LED的技术发展和应用分析

    总体来看,超高亮度LED的发展极大地推动了显示和光电技术的进步,不仅提升了显示效果,还在能源效率、环保和耐用性方面展现出巨大优势。随着技术的不断创新,预计未来LED将在更多领域得到广泛应用,进一步改变我们的...

    低成本8位微控制器的高亮度LED照明设计.pdf

    在当代的汽车行业,高亮度LED(HBLED)技术已经成为提升车辆造型、安全性能以及燃油经济性的重要手段。从车内的开关照明到LCD背光显示,再到外部的头灯照明,HBLED的应用范围不断扩大。然而,如何高效、可靠地控制...

    机器人控制技术 数码管静态显示与动态显示.docx

    对于那些对亮度要求较高、显示位数较少、并且不希望占用过多I/O口的系统,静态显示可能是更好的选择。而在需要大量显示位数,对I/O口资源有限制,且可以接受稍低亮度的情况下,动态显示技术则是更经济高效的解决方案...

    一款基于单片机的LED动态显示模块方案设计.pdf

    静态驱动通过单片机的每个I/O端口独立控制数码管的各段,优点是编程简单,显示亮度高,但缺点是占用较多的I/O端口,因此硬件设计会更为复杂。而动态驱动则通过将数码管的各段共通端连接起来,并通过位选通控制电路来...

    AL8400线性高亮度LED驱动控制器原文资料.pdf

    它的低参考电压、宽温度范围、小的参考电压公差、低温度漂移、开放集电极输出以及高电源抑制比等特点使得它在照明、显示和指示系统中能对多元化的高亮度LED电流进行紧密调节。 AL8400的功能性块图展现了其内部结构...

    视角对LED显示屏亮度均匀性的影响分析

    测量结果表明,如果三个区域的发光强度角分布曲线相同,并且测量的亮度值满足国家C级标准,则可以认为整个LED显示屏具有较好的亮度均匀性。 综上所述,视角对LED显示屏亮度均匀性具有显著影响。为了解决视角变化所...

    高亮度半导体激光器拓展新波长.pdf

    在设计和应用这些高亮度光纤耦合半导体激光器时,需要考虑一系列重要设计规则,特别是针对非标准波长的激光器。 首先,我们需要了解波长对半导体激光器光束质量的影响。最低衍射极限光束参数乘积(BPP)与波长成...

    基于单片机的多点阵LED字符显示屏的设计(完整资料).doc

    * 软件部分的编程需要考虑点阵显示屏的实现、显示屏的各发光二极管的亮度足够并且均匀、显示稳定、清晰的图形或者文字等方面 知识点五:LED点阵显示屏的功能实现 * LED点阵显示屏的功能实现需要考虑显示屏的各发光...

    首尔半导体推出高亮度LED新品加速攻克照明市场 (2).pdf

    Z7系列是一款4W的高亮度白光LED,色温为5500K,亮度为4401m,可以替代P7系列,并且封装尺寸小巧,适用于室内和室外照明产品。Z6系列则提供了红、绿、蓝和白色光,4个LED芯片独立,适合需要炫目效果的景观照明、舞台...

    多投影仪自由立体显示的GPU几何及亮度校正技术.pdf

    实验结果表明,采用本文方法可以有效地解决自由立体显示系统中的几何校正和亮度校正问题,并且校正速度快、显示效果好。本文的贡献在于解决了多投影仪自由立体显示系统中的几何校正和亮度校正问题,为提高显示效果和...

    毕业设计(论文)--基于单片机的点阵显示系统设计.doc

    点阵显示屏的优点包括:鲜艳的色彩、广泛的动态范围、高亮度、长寿命和稳定可靠的工作性能等。这些优点使其成为众多显示媒体和户外作业显示的理想选择。 在设计中,我们使用了STC89C52单片机作为核心控制器,该...

    显示/光电技术中的安华高科技首款高亮度RGB表面贴装LED ASMT-QTB2

    标题中的“显示/光电技术中的安华高科技首款高亮度RGB表面贴装LED ASMT-QTB2”指的是Avago Technologies(安华高科技)推出的创新产品,该产品是一款高亮度的RGB表面贴装LED,型号为ASMT-QTB2,主要用于显示和光电...

Global site tag (gtag.js) - Google Analytics