FastAdmin 开发学习给输入框加上清除功能

在社区上有小伙伴询问如果给输入框加上清除功能，因为有时修重新搜索时需要将输入框的内容快速清除，所以这个功能对用户非常友好。
如上图所示这种。

我看了一下之前有见过，这个找了一下资料发现现代的浏览器都支持这个功能。
只需要将 input 为 type= "search" 即可。
效果如下：

在 Google Chrome 中的显示效果

在 IE 11 中的显示效果

在 Edge 中的显示效果

FastAdmin 开发学习给输入框加上清除功能的更多相关文章

  1. 为Jquery EasyUI 组件加上“清除”功能

    1.背景 在使用 EasyUI 各表单组件时,尤其是使用 ComboBox(下拉列表框).DateBox(日期输入框).DateTimeBox(日期时间输入框)这三个组件时,经常有这样的需求,下拉框或 ...

  2. 为JQuery EasyUI 表单组件加上“清除”功能

    1.背景 在使用 EasyUI 各表单组件时,尤其是使用 ComboBox(下拉列表框).DateBox(日期输入框).DateTimeBox(日期时间输入框)这三个组件时,经常有这样的需求,下拉框或 ...

  3. （转载） Android 带清除功能的输入框控件ClearEditText,仿IOS的输入框

    Android 带清除功能的输入框控件ClearEditText,仿IOS的输入框 标签: Android清除功能EditText仿IOS的输入框 2013-09-04 17:33 70865人阅读  ...

  4. 【转载】salesforce 零基础开发入门学习（一）Salesforce功能介绍，IDE配置以及资源下载

    salesforce 零基础开发入门学习(一)Salesforce功能介绍,IDE配置以及资源下载   目前国内已经有很多公司做salesforce,但是国内相关的资料确是少之又少.上个月末跳槽去了新 ...

  5. Python实现使用tkinter弹出输入框输入数字, 具有确定输入和清除功能

    Python3.6中用tkinter, 弹出可以输入数字的输入框. # Copyright (c) 2017-7-21 ZhengPeng All rights reserved. def pop_u ...

  6. Android开发学习之路-RecyclerView滑动删除和拖动排序

    Android开发学习之路-RecyclerView使用初探 Android开发学习之路-RecyclerView的Item自定义动画及DefaultItemAnimator源码分析 Android开 ...

  7. Android开发学习路线图

    Android开发学习方法: Android是一个比较庞大的体系,从底层的Linux内核到上层的应用层,各部分的内容跨度也比较大.因此,一个好的学习方法对我们学习Android开发很重要. 在此建议, ...

  8. Android开发学习总结(一)——搭建最新版本的Android开发环境

    Android开发学习总结(一)——搭建最新版本的Android开发环境(转) 最近由于工作中要负责开发一款Android的App,之前都是做JavaWeb的开发,Android开发虽然有所了解,但是 ...

  9. 步步为营 SharePoint 开发学习笔记系列总结

    转:http://www.cnblogs.com/springyangwc/archive/2011/08/03/2126763.html 概要 为时20多天的sharepoint开发学习笔记系列终于 ...

随机推荐

  1. 进程创建过程详解 CreateProcess

    转载请您注明出处:http://www.cnblogs.com/lsh123/p/7405796.html 0x01 CreateProcessW CreateProcess的使用有ANSI版本的Cr ...

  2. python中的if判断语句

    判断(if)语句 目标 开发中的应用场景 if 语句体验 if 语句进阶 综合应用 01. 开发中的应用场景 生活中的判断几乎是无所不在的,我们每天都在做各种各样的选择,如果这样?如果那样?……  ...

  3. 火狐下，td 的 bug;

    想实现类似的效果,看代码, <div style="width:488px;float:left; margin:-52px 0px 15px 15px;"> < ...

  4. kbmMW功能＃5 - kbmMWProcess单元

    在新的kbmMW v.5.06.20版本中新加kbmMWProcess单元.通过TkbmMWProcess类的各种类方法,可以轻松地在Windows上对外部进程进行分组,启动和停止.在即将发布的小修补 ...

  5. IE8的input兼容性问题

    在chrome.firefox.IE9+都是支持input事件 在IE8中,单纯的input事件无法监听输入框中变化,需要与propertychange共用 测试代码如下: <!DOCTYPE ...

  6. 看我怎么扒掉CSDN首页的底裤（python selenium+phantomjs爬取CSDN首页内容）

    这里只是学习一下动态加载页面内容的抓取,并不适用于所有的页面. 使用到的工具就是python selenium和phantomjs,另外调试的时候还用了firefox的geckodriver.exe. ...

  7. ngxinx 配置

    vim 复制操作 1.复制 1)单行复制 在命令模式下,将光标移动到将要复制的行处,按“yy”进行复制: 2)多行复制 在命令模式下,将光标移动到将要复制的首行处,按“nyy”复制n行: 其中n为1. ...

  8. <转载> VUE项目中CSS管理

    vue的scoped 在vue项目中,当 .vue文件中 <style> 标签有 *scoped 属性时,它的 CSS 只作用于当前组件中的元素,很好的实现了样式私有化的目的. 使用sco ...

  9. windows环境下安装Anaconda（Python）

    参考网址:http://www.jianshu.com/p/169403f7e40chttp://blog.csdn.net/qq_26898461/article/details/51488326 ...

  10. web（四）html表单类标签

    表单类标签 操作者用于输入信息,并将信息提交给服务器的标签集合. 表单标签介绍 form标签:表单元素(其余标签)标签的容器标签 input标签:用于用户信息输入的标签. button标签:按钮标签. ...