首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

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

一、JS 控制默认文字 先说一下问题: 用 HotNewspro 主题的网站,默认的留言输入框是这样的: ? 常规情况下,光标聚焦留言输入框,这个预设提示文字是会自动消失的: ?...好了,先来看下 HotNewspro 的这个预设提示文字js 代码,这个 js 代码位于主题 js 目录下的 custom.js 文件中: //Comments $(document).ready(...JS 实现方法,网上还有另一种类似实现形式: <input type="text" value="默认<em>提示</em><em>文字</em>" onclick="if(this.value=='默认<em>提示</em><em>文字</em>'){this.value...鼠标 onclick 点击时,判断<em>输入框</em>是不是初始的【默认<em>提示</em><em>文字</em>】,如果是就清空; b. 鼠标光标离开<em>输入框</em>时,判断<em>输入框</em>里面是否为空,如果为空就自动填入【默认<em>提示</em><em>文字</em>】。...当然,针对上文问题情境,完全可以通过给【点击表情这个动作】绑定一个清空预设<em>文字</em>功能,点击表情时先判断<em>输入框</em>是否是【默认<em>提示</em><em>文字</em>】,如果是就先清空,然后在插入表情,从而解决问题。

3.5K90

jQueryUI实现自动完成输入框提示

在昨天我发表了一个jQueryUI的effect方法,下面我再来给大家介绍一个通过jQueryUI来实现自动完成输入框提示的方法。他需要调用jQuery对象的 autocomplete ( )方法。...先来说说他的三个常用参数: source:自动提示信息的来源。minLength:输入指定个数字符后产生提示。position:提示框的位置。...autocomplete ( )常用的事件(可以绑定事件处理函数): search:开始查找时;select:选择指定项时;close:提示框关闭后。...下面来举一个小例子来说明一下: $("#course").autocomplete(){ source:["c","c++","java","jsp"],//指定来源 minLength:0,//指定输入多少字符开始出现提示...search:function(){//实现方法 //... } }); 当然,在使用之前必须导入相应的js文件,本站提供下载链接。

1.3K20

给input填充提示文字

很多时候我们发现input输入框里有提示文字,当我们输入内容后,提示文字消失,不输入内容,提示文字出现,这里我来介绍两种方式来实现。...第一种方式是通过js的方式来实现,首先我们从input的获取焦点和失去焦点两个事件,预先将提示文字写在input的value值里,例如,...这样我们在看到的效果里就会是文本框里有我是提示文字文字了,当我们点击文本框即文本框获取到了焦点,这时将value的值设置为空,例如: function removeWenzi(){ $("#inp...").val(""); } 这时给input添加onfocus事件,例如这样我们点击文本框的时候文字就会消失...()" value="我是提示文字" /> 第二种方法就是直接给input添加placeholder,例如即可,效果和上面的那种方法大体相同。

2.2K20

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

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

3K50

WordPress自定义栏目运用实例V:为加密文章添加密码提示文字

默认的话,WordPress中加密的文章时不会有任何的提示的,就一个“加密:”在文章名前面。通常的话,解决这个问题的话我都是直接将密码写在题目中的(比如说这儿,还有这儿)。...之前在weisay主题中看到一个可以为加密文章添加密码提示文字的方法,研究了下是用自定义栏目来实现的,现在将它分享出来。 将下面的代码丢入主题的funtions.php文件的最后一个 ?.../wp-pass.php'; if($hint) $hint = '密码提示:'....return $c; } } add_filter('the_content', 'password_hint'); 第一次使用是,在文章的自定义栏目添加一个名称为password_hint,值为密码提示信息...上面那个密码提示信息例子答案你该知道吧?国民党,或者说国军。绝对不是某party。

75580
领券