V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
Mazi
V2EX  ›  分享创造

做了一个搜索框可以快速进入各大网站搜索,请 V 站汉子妹子指教

  •  2
     
  •   Mazi · 2018-06-07 15:07:48 +08:00 · 4932 次点击
    这是一个创建于 2352 天前的主题,其中的信息可能已经有所发展或是发生改变。

    我做的这个东西,简单来说,就是通过一个统一的搜索框,点击搜索即可进入各大网站的搜索页面,不用先进入那些网站首页再找到他们的搜索框输入关键词搜索。

    我做这个是受北邮人导航启发。下图就是北邮人导航网页截图。

    byr.wiki

    去年看到的时候这个网站的时候,我觉得多此一举,完全没必要。以淘宝搜索来说,进入这个搜索导航搜索需要先打开一次网站首页,进入淘宝网站搜索也是先打开一次网站首页,操作完全一样,完全没必要用这个导航。

    我也基本上没有需要同时搜索几个网站的需求,所以也没怎么在意。

    但是,我慢慢发现打开目标网站首页和打开一个搜索框网站首页真的不一样,尤其是电脑配置不高或者网速不好的情况下,打开购物或者视频网站往往要等几秒甚至十多秒加载完成输入框才能输入,真的太慢了,有时候突然想起一个东西想搜索,等它网站首页加载好的时候我已经忘记想搜什么了。

    相比之下,可以秒开的搜索框网页,优势明显。

    于是我做了这个搜索框导航,页面内容很简单,一个搜索框和一堆网站按钮。不过,网站按钮只是看起来是按钮,实际是 a 标签超链接,当输入框为空时链接是目标网站的首页地址,当你输入关键词后链接就会变成目标网站的站内搜索地址。

    这是输入框为空时,注意看左下角链接,此时是目标网站首页地址。

    首页

    这是输入关键词后,注意看左下角链接,此时是目标网站站内搜索地址。

    搜索

    输入关键词后,所有网站按钮链接都变成了此关键词在该网站的搜索地址。

    由于是 a 超链接,按住 Ctrl 键点击不同网站按钮可以实现快速不同网站搜索。

    为了方便输入,我还通过百度 opensug.js 提供了百度的搜索提示。

    搜索提示

    探讨

    网站首页: https://menshen.org/

    目前实现的功能就这么一个,我还计划添加拖拽图片进来时提供百度、谷歌、淘宝、京东等图片搜索功能。

    此外,现有的网站列表只是我目前想到一些常用网站,还有很多网站没添加进来,比如说 Github,我计划建立几个网站列表,面向不同用户群体,允许用户自行切换和添加网站。

    值得一说的是,Vue.js 双向绑定真的挺好用,不信你打开网站后 F12 进入 console 控制台, 输入下面这行代码,就可以在第一列网站列表后面添加 Github 站内搜索。不过,网页刷新后就没有了,因为现在还没有添加保存功能。

    menshenAPP.buttons.engine.push({name:'GitHub', home:'https://github.com/', queryUrl:'https://github.com/search?utf8=%E2%9C%93&q=%s&type=' })
    

    这个项目是纯前端项目,将来添加的自定义功能的修改数据默认只是使用 localStorage 保存在客户端。不过,我准备在完成图片搜索功能后把所有代码发布到 Github 开源,提供给大家搭建适合自己的搜索框。

    我介绍完了。

    请 V 站的汉子和妹子们给点建议和帮助,期待你们能帮忙丰富网站列表和完善代码。

    32 条回复    2018-06-12 16:43:27 +08:00
    soho176
        1
    soho176  
       2018-06-07 15:23:38 +08:00
    那么我来提一个建议吧,比如提供站内搜索功能啊,就是说 我输入关键词 点击知乎,然后 搜出来的结果就是知乎的内容,可以是百度的索引 也可以是知乎站内搜索,微博了,淘宝了什么的,输入关键词 直接也是打开站内搜索多好。
    soho176
        2
    soho176  
       2018-06-07 15:25:01 +08:00
    额 没看清楚,我还以为 只有搜索栏下面的是这样的,其余的就是导航那。。
    Mazi
        3
    Mazi  
    OP
       2018-06-07 15:28:52 +08:00
    @soho176 网站列表全部都提供站内搜索的,只有电影天堂用了百度站内搜索,所以电影天堂的名字是“电影天堂·百度”。

    目前网站比较简陋,么有使用指引,可能是不好理解。
    Mazi
        4
    Mazi  
    OP
       2018-06-07 15:29:55 +08:00
    @soho176

    所有网站都一样,没有输入关键词的时候,是导航,点击进入网站首页。
    输入了,就是搜索,点击进入站内搜索。
    soho176
        5
    soho176  
       2018-06-07 15:42:09 +08:00
    @Mazi 理解了 很好,很方便,以前我搜 东西就是在百度 关键字 加网址, 这样方便了。
    0vels
        6
    0vels  
       2018-06-07 15:44:02 +08:00
    挺方便,但是我还是习惯用 chrome 自带的搜索功能,比如说要在知乎搜索,只需要输入 zhihu (剩下的会自动补全),然后按 TAB 键就可以直接搜了
    F1024
        7
    F1024  
       2018-06-07 15:47:07 +08:00
    http://s.uc.cn/ 这个功能挺好 不太美观你参考下
    Mazi
        8
    Mazi  
    OP
       2018-06-07 15:53:27 +08:00
    @0vels 先添加搜索引擎,再输入关键字切换搜索引擎,在单个网站搜索时这个方法也不错。不过要在多个网站搜索时,就没有门神搜索框这么方便了。
    zhoushiya
        9
    zhoushiya  
       2018-06-07 15:53:37 +08:00
    要是再加几个 iframe 同时显示结果,那不就是次世代工作站 TNT 的伟大创意么?
    Mazi
        10
    Mazi  
    OP
       2018-06-07 15:57:06 +08:00
    @F1024 不错不错,同性质的网站,很有参考价值,谢谢。
    Mazi
        11
    Mazi  
    OP
       2018-06-07 15:59:35 +08:00
    @zhoushiya XD,那我是不是 slogan 改成:重新定义下一个十年的网址导航
    qiayue
        12
    qiayue  
       2018-06-07 16:01:04 +08:00
    大约是 2008 年还是 2009 年,我注册了个域名 juhekuang.com 也是做这个事情,一样的一个框,多个按钮
    不过后来关站了
    nine99
        13
    nine99  
       2018-06-07 16:17:25 +08:00
    还好
    Mazi
        14
    Mazi  
    OP
       2018-06-07 16:19:19 +08:00
    @qiayue 前辈啊。查了一下,是这个吗?

    ![jhk][http://p9xu92mju.bkt.clouddn.com/img/jhk_20180607161307.png]

    要做的事情一样,不过实现过程不一样,我看你的搜索不是直接跳转到目标网站,而是先进入你的 .php 文件。我的是静态,完全前端的。
    Mazi
        15
    Mazi  
    OP
       2018-06-07 16:20:17 +08:00
    qiayue
        16
    qiayue  
       2018-06-07 16:55:39 +08:00
    @Mazi 好像是这个吧,你通过 archive.org 找的吗
    Mazi
        17
    Mazi  
    OP
       2018-06-07 17:04:50 +08:00
    @qiayue 是的
    Mazi
        19
    Mazi  
    OP
       2018-06-07 21:46:01 +08:00
    @starship 谢谢
    huafang
        20
    huafang  
       2018-06-07 23:01:45 +08:00
    十三年前 我搞过这类
    Pai
        21
    Pai  
       2018-06-07 23:16:26 +08:00 via iPhone
    公安网备 这么好备?
    kookpua
        22
    kookpua  
       2018-06-07 23:21:33 +08:00 via iPhone
    chrome 有个插件 我是不是分享过了
    kookpua
        23
    kookpua  
       2018-06-07 23:23:02 +08:00 via iPhone
    看看这个 可以在任何页面切出来的,搜索款,可以使用快捷键 https://www.v2ex.com/t/408997?p=1
    Mazi
        24
    Mazi  
    OP
       2018-06-07 23:27:19 +08:00
    @Pai 比 ICP 备容易。
    Mazi
        25
    Mazi  
    OP
       2018-06-07 23:29:42 +08:00
    @kookpua 插件比较适合爱折腾的人,还有一些人喜欢开箱即用。
    omph
        26
    omph  
       2018-06-08 00:18:40 +08:00
    做成浏览器扩展比较合适
    其实 new tab 类的不少
    chenstor
        27
    chenstor  
       2018-06-08 09:13:02 +08:00
    这种直接跳转,跟到对应的官网搜索,有什么优势?仅仅是因为网站是纯静态?
    argc
        28
    argc  
       2018-06-08 09:18:51 +08:00
    所以让子弹飞大胸女到底是谁啊
    sevenQu
        29
    sevenQu  
       2018-06-09 09:26:47 +08:00
    我现在的习惯是直接在上面的网址框输入搜索
    jookr
        30
    jookr  
       2018-06-09 09:33:27 +08:00


    设置为浏览器选中文字拖放的结果页面 简单粗暴
    seogo
        31
    seogo  
       2018-06-09 16:22:17 +08:00
    简单粗暴,web.geekji.cn
    sometimehappy
        32
    sometimehappy  
       2018-06-12 16:43:27 +08:00
    <b>我发现个用户体验硬伤:在输入框输入关键词时,弹出的关键词提示会遮挡住下面的百度、google 等提交按钮</b>
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   4863 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 01:10 · PVG 09:10 · LAX 17:10 · JFK 20:10
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.