首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

分析:input表单输入默认提示信息

相信上面两张图片上的输入里有提示信息这功能大家都见过,有的人应该也自己动手做过。   ...我之前也做过,做法应该和大家都差不多,在输入里写入提示内容,当鼠标获取焦点后清空内容,当失去焦点后判断内容是否为空,如果为空,则恢复显示提示内容,反则不显示。但这样的做法是否合理?...1、如果输入内容和提示内容完全一样,当失去焦点后,应该如何判断?   ...2、如果input在表单里,提交表单后,提示信息随着表单一并提交,难道还要在后端判断提交信息不等于提示信息,再进行数据操作么?   3、如果1、2两条都触发,后端要如果操作?   ...其实方法很简单,把提示信息单独写在一个模块里,如div,然后设置这个div的样式,让它浮动到输入框上面,至于js,只需多写一句,当我点击这个div的时候,也触发input的获取焦点事件即可。

3K50
您找到你想要的搜索结果了吗?
是的
没有找到

如何实现搜索的关键词提示功能

当你搜索某一关键词时,它会贴心在下拉补全一些热门关键词,像下图这样: 搜索关键词提示 你点击某一关键词,页面就直接跳转到结果页面,这种显示搜索关键词提示功能,一定程度上节省用户的搜索时间。...但是,在公司内部的很多系统中,搜索中都没有这个功能。如果你能实现这个功能,那么你的用户在使用时肯定会眼前一亮,顿生好感,领导看到后也会给你点赞。...前端的实现网上一搜一大堆,比如搜索关键字「搜索自动补全」就有很多结果,这里就不说了。这里主要说下后端如何实现。...github.com/pytries/marisa-trie https://marisa-trie.readthedocs.io/en/latest/tutorial.html 写在最后 上述只实现了搜索智能提示的一小步...第一个问题比如好解决,我们可以按搜索的频度或关键词的搜索结果数来为每个关键词自动生成一个权重数,按权重从大到小选择性的显示前 n 条即可。

2.9K20

Javaweb-案例练习-2-给搜索添加提示

搜索添加搜索提示功能 这篇来利用Ajax做一个给搜索添加搜索提示的功能,这个我们在百度首页,搜索随便输入一个字符,就能弹出联想自动,可供用户选择,这篇要做的就是这么一个场景。 1. ...给搜索添加信息提示 在mene_search.jsp中,给搜索先整出一个div来,宽度和搜索的宽度一样,为了显示明显,先来给边框添加红色。...刷新浏览器,看看/index.jsp效果,搜索输入一个J看看,div提示的效果。...解决点击搜索按钮,填充到搜索 上面为止,我们做到了颜色变化,但是没有点击效果,而且 搜索不输入的时候,默认div显示的是数据库中全量数据的图书name,这肯定不行。...下面代码调整之后,可以点击填充到搜索,和解决这个搜索不输入任何字符,提示全量name这个问题。

1.2K41

Javaweb-案例练习-2-给搜索添加提示

搜索添加搜索提示功能 这篇来利用Ajax做一个给搜索添加搜索提示的功能,这个我们在百度首页,搜索随便输入一个字符,就能弹出联想自动,可供用户选择,这篇要做的就是这么一个场景。 1....给搜索添加信息提示 在mene_search.jsp中,给搜索先整出一个div来,宽度和搜索的宽度一样,为了显示明显,先来给边框添加红色。...刷新浏览器,看看/index.jsp效果,搜索输入一个J看看,div提示的效果。 到这里,还有问题没有解决,那就是点击div中提示,不能点击,我们需要点击之后,自动填充到search。...解决点击搜索按钮,填充到搜索 上面为止,我们做到了颜色变化,但是没有点击效果,而且 搜索不输入的时候,默认div显示的是数据库中全量数据的图书name,这肯定不行。...下面代码调整之后,可以点击填充到搜索,和解决这个搜索不输入任何字符,提示全量name这个问题。

1.1K20

利用placeholder属性来添加输入默认文字提示,提高用户体验

一、JS 控制默认文字 先说一下问题: 用 HotNewspro 主题的网站,默认的留言输入是这样的: ? 常规情况下,光标聚焦留言输入,这个预设提示文字是会自动消失的: ?...鼠标 onclick 点击时,判断输入是不是初始的【默认提示文字】,如果是就清空; b. 鼠标光标离开输入时,判断输入里面是否为空,如果为空就自动填入【默认提示文字】。...当然,针对上文问题情境,完全可以通过给【点击表情这个动作】绑定一个清空预设文字功能,点击表情时先判断输入是否是【默认提示文字】,如果是就先清空,然后在插入表情,从而解决问题。...二、placeholder 属性 文本(INPUT)的 placeholder 属性是 HTML5 里新引入的新特征之一,它能够让你在文本里显示提示信息,一旦你在文本里输入了什么信息,提示信息就会隐藏...非常简单的玩意,在中国博客联盟和张戈博客的搜索,早就应用了 placeholder 预设文字属性,细心观察的朋友,右键看一下源代码都可以了然于心了!

3.6K90
领券