请教个搜索关键词高亮的问题

lhmwzy · 2012-03-20T22:07:06+00:00

Hi, kindy这个进展的如何了？珣新2012/3/21 kindy <kin...@gmail.com> ~/resty/http....

请教个搜索关键词高亮的问题

lhmwzy

在openresty中如何实现在搜索结果中实现搜索关键词高亮？
string:sub ? ngx.re.sub?

gwill.buzz

在 2012年3月20日 下午10:07，lhmwzy <lh...@gmail.com> 写道：
> 在openresty中如何实现在搜索结果中实现搜索关键词高亮？
> string:sub ? ngx.re.sub?

把搜索词也传回来，在前端操作感觉更好一些。

>
>
>

lhmwzy

前端似乎行不通，要替换的区域是通过AJAX从后端传过来的，前端JS似乎对这样的情况无法高亮着色

zoom.quiet

在 2012年3月20日 下午10:49，lhmwzy <lh...@gmail.com> 写道：
> 前端似乎行不通，要替换的区域是通过AJAX从后端传过来的，前端JS似乎对这样的情况无法高亮着色
>
- 这恰恰是前端应该作的事儿吼
- jQuery 进行搜索,动态追加 css 效果
- openresty 就是个 web 应用服务器,输出数据,不应该管理形式的,,


--
人生苦短, Pythonic! 冗余不做,日子甭过!备份不做,十恶不赦!
俺: http://about.me/zoom.quiet
文字协议: http://creativecommons.org/licenses/by-sa/2.5/cn/

lhmwzy

嗯，我也认为前端比较不错
但代码是这样的
<body>
...
<div id="result">
</div>
.....
</body>
<script type="text/_javascript_">
        jQuery("#q").bind('input',function () {
                if ($("#q").val().length>=2) {
                        var q=$("#q").val();
                        $(".result").html("<img src="" 正在查找。。
                        $(".result").load("/luapp/tel/search",{query:q});
                }
        });
</script>

然后，这样前端用JS似乎无法替换从后端通过jquery的.load方法传过来的内容

zoom.quiet

在 2012年3月20日 下午11:08，lhmwzy <lh...@gmail.com> 写道：
> 嗯，我也认为前端比较不错
> 但代码是这样的
> <body>
> ...
> <div id="result">
> </div>
> .....
> </body>
> <script type="text/javascript">
>         jQuery("#q").bind('input',function () {
>                 if ($("#q").val().length>=2) {
>                         var q=$("#q").val();
>                         $(".result").html("<img src='images/loading.gif'>
> 正在查找。。
>                         $(".result").load("/luapp/tel/search",{query:q});
>                 }
>         });
> </script>
>
>
> 然后，这样前端用JS似乎无法替换从后端通过jquery的.load方法传过来的内容
>
- load 到一个隐藏的 textarea
- 然后,另外一个 jQ 函式处理,,,
- 当然,从 lua 中,先嵌入带css class 包围的 span 也是可以的
  - 关键也是 正则表达式了
  - 有 replace 的,,,
  - 内置不给力的话,用 luarocks 搜索是否有方便的,,,
  - 不过,这样就是阻塞处理了,,,


--
人生苦短, Pythonic! 冗余不做,日子甭过!备份不做,十恶不赦!
俺: http://about.me/zoom.quiet
文字协议: http://creativecommons.org/licenses/by-sa/2.5/cn/

xuanbei

分词如何解决呢？
在 2012-3-20，下午10:59， Zoom.Quiet 写道：

> 在 2012年3月20日 下午10:49，lhmwzy <lh...@gmail.com> 写道：
>> 前端似乎行不通，要替换的区域是通过AJAX从后端传过来的，前端JS似乎对这样的情况无法高亮着色
>>
> - 这恰恰是前端应该作的事儿吼
> - jQuery 进行搜索,动态追加 css 效果
> - openresty 就是个 web 应用服务器,输出数据,不应该管理形式的,,
>
>
> --
> 人生苦短, Pythonic! 冗余不做,日子甭过!备份不做,十恶不赦!
> 俺: http://about.me/zoom.quiet
> 文字协议: http://creativecommons.org/licenses/by-sa/2.5/cn/
>
> his email (including any attachments) is confidential and may be legally privileged. If you received this email in error, please delete it immediately and do not copy it or use it for any purpose or disclose its contents to any other person. Thank you.

本电邮(包括任何附件)可能含有机密资料并受法律保护。如您不是正确的收件人，请您立即删除本邮件。请不要将本电邮进行复制并用作任何其他用途、或透露本邮件之内容。谢谢。

zoom.quiet

在 2012年3月20日 下午11:07，玄悲 <xua...@taobao.com> 写道：
> 分词如何解决呢？
- 使用服务端的搜索引擎,暴露给 openresty http/sockset 接口就好

> 在 2012-3-20，下午10:59， Zoom.Quiet 写道：
>
>> 在 2012年3月20日 下午10:49，lhmwzy <lh...@gmail.com> 写道：
>>> 前端似乎行不通，要替换的区域是通过AJAX从后端传过来的，前端JS似乎对这样的情况无法高亮着色
>>>
>> - 这恰恰是前端应该作的事儿吼
>> - jQuery 进行搜索,动态追加 css 效果
>> - openresty 就是个 web 应用服务器,输出数据,不应该管理形式的,,
>>
>>
>> --
>> 人生苦短, Pythonic! 冗余不做,日子甭过!备份不做,十恶不赦!
>> 俺: http://about.me/zoom.quiet
>> 文字协议: http://creativecommons.org/licenses/by-sa/2.5/cn/
>>
>> his email (including any attachments) is confidential and may be legally privileged. If you received this email in error, please delete it immediately and do not copy it or use it for any purpose or disclose its contents to any other person. Thank you.
>
> 本电邮(包括任何附件)可能含有机密资料并受法律保护。如您不是正确的收件人，请您立即删除本邮件。请不要将本电邮进行复制并用作任何其他用途、或透露本邮件之内容。谢谢。
>
> --
人生苦短, Pythonic! 冗余不做,日子甭过!备份不做,十恶不赦!
俺: http://about.me/zoom.quiet
文字协议: http://creativecommons.org/licenses/by-sa/2.5/cn/

kindy61

把

$(".result").load("/luapp/tel/search",{query:q});
改成：

$.get("/luapp/tel/search",{query:q}, function(res) {

$(".result").html(res ? (res.replace(new RegExp('(' + q + ')', 'g'), '<span style="color:red">$1</span>')) : '无结果');

});

就可以实现简单查询词的高亮了。

如果 q 里面包含特殊字符，比如 /, (, . 等，在构造 RegExp 的时候转义一下就好。

On Tue, Mar 20, 2012 at 11:07 PM, 玄悲 <xua...@taobao.com> wrote:

分词如何解决呢？
在 2012-3-20，下午10:59， Zoom.Quiet 写道：

> 在 2012年3月20日下午10:49，lhmwzy <lh...@gmail.com> 写道：
>> 前端似乎行不通，要替换的区域是通过AJAX从后端传过来的，前端JS似乎对这样的情况无法高亮着色
>>
> - 这恰恰是前端应该作的事儿吼
> - jQuery 进行搜索,动态追加 css 效果
> - openresty 就是个 web 应用服务器,输出数据,不应该管理形式的,,
>
>
> --
> 人生苦短, Pythonic! 冗余不做,日子甭过!备份不做,十恶不赦!
> 俺: http://about.me/zoom.quiet
> 文字协议: http://creativecommons.org/licenses/by-sa/2.5/cn/
>
>
--

--

林青(Kindy Lin)