JavaScript前端：输入框关闭弹出历史记录功能

绝地灬酷狼 2024-03-30 17:18 79阅读 0赞

#### JavaScript前端：输入框关闭弹出历史记录功能 ####

*  前言
 *  一、取消输入框弹出历史记录
 *   *  1.利用input标签的autocomplete属性
     *  2.利用form标签的autocomplete属性
 *  总结

--------------------

## 前言 ##

现在很多网页或者程序为了方便用户的使用，都会如此设置：**用户点击输入框时，会弹出最近输入的内容（即历史记录）。**

**优点：** 对于需要重复输入的内容，该设置可以极大的避免多次输入重复的内容，提高用户输入的效率.

**缺点：** 对于每次大概率需要输入不同内容时，弹出历史记录并没有什么作用，往往不会给用户带来便利。如果用户不小心点错了，可能还需要删除输入框中的部分内容，此时对用户来说就是一种负担，不如直接关闭输入框弹出历史记录功能。

本文介绍了如何关闭输入框弹出历史记录功能。

--------------------

## 一、取消输入框弹出历史记录 ##

### 1.利用input标签的autocomplete属性 ###

<input type="text"  autocomplete="off" />

这种方法应该是最多博主分享的，也是网上最常见的做法。

**如果没有生效，则需要检查你的input 标签中是否有name或者id属性，没有则需要加入name或者id属性。**

根据我的经验来看，这个方法并不能解决所有此类问题。建议可以尝试一下，看看效果。

**参考链接**: [HTML 标签的 autocomplete 属性][HTML _ autocomplete]

### 2.利用form标签的autocomplete属性 ###

如果关闭单个输入框弹出历史记录功能不起效果，可以考虑关闭整个表单的弹出历史记录功能。这种方法简单粗暴，但是缺点也很明显，即这个表单中的所有输入框都不能再弹出历史记录，当有些输入框大部分时候需要输入重复内容的时候还是建议开启。这种方法仅能在合适的地方使用，在使用的时候需要谨慎。

<form class="form-horizontal"  autocomplete="off" >

--------------------

## 总结 ##

本文介绍了如何关闭输入框弹出历史记录功能。  
希望对大家有用！

[HTML _ autocomplete]: https://www.w3school.com.cn/tags/att_input_autocomplete.asp

发表评论取消回复

表情：

评论列表（有 0 条评论，79人围观）

还没有评论，来说两句吧...

相关阅读

相关 JavaScript前端：输入框关闭弹出历史记录功能

JavaScript前端：输入框关闭弹出历史记录功能前言一、取消输入框弹出历史记录 1.利用input标签的autocomplete属性

绝地灬酷狼/ 2024年03月30日 17:18/ 0 赞/ 80 阅读

相关 android 底部弹出输入框,Android编程：底部弹出输入框

Android编程：底部弹出的对话框环境：主机:WIN10 开发环境:Android Studio 2.2 Preview 3 说明：在《Android编程：底

╰+攻爆jí腚メ/ 2022年10月17日 11:21/ 0 赞/ 6 阅读

相关【JavaScript】8.弹出框（Dialog）

最近做项目，用到了弹出框提示信息，就做了个demo，记录总结了一下，对一般的网站来说，弹出框是比较常见的。或是给出用户操作提示，或是通过弹出框打开一个小窗口以提示信息，或是给出

叁歲伎倆/ 2022年06月01日 13:06/ 0 赞/ 299 阅读

相关 Bootstrap 弹出输入框

效果 ![这里写图片描述][70] 原理引入 `Bootstrap` 和 `jQuery` 在 `弹框` 中加入输入框，同时 `自动获得焦点`

柔光的暖阳◎/ 2022年05月18日 01:42/ 0 赞/ 346 阅读

相关 js弹出输入框

分享一下我老师大神的人工智能教程！零基础，通俗易懂！[http://blog.csdn.net/jiangjunshow][http_blog.csdn.net_jiangju

逃离我推掉我的手/ 2022年04月17日 06:13/ 0 赞/ 447 阅读

相关 layui 关闭弹出框

作者：TROY\_Musou 原文：[https://blog.csdn.net/troy\_musou/article/details/73499459][https_b

快来打我*/ 2022年04月03日 13:40/ 0 赞/ 432 阅读

相关清除input输入框的历史记录

> 今天怂怂就为大家分享一篇清除input输入框历史记录的实例讲解，具有很好的参考价值，希望对大家有所帮助。一起跟随怂怂过来看看吧清除input输入框的历史记录，即在in

谁践踏了优雅/ 2022年02月24日 04:59/ 0 赞/ 757 阅读

相关 js前端弹出框实例

描述：点击按钮弹出弹出框引入jquery-ui相关组件 <script type="text/javascript" src="../fe-res/js/jqu

古城微笑少年丶/ 2021年12月16日 11:04/ 0 赞/ 331 阅读

相关 JavaScript弹出框

提到弹出框，首先想到的alert()了，其次想到的也还是alert（），其实在js中有三种弹出框，下面我们一一说明。 1，仅确定。即：对话框界面上只有确定

忘是亡心i/ 2021年10月13日 04:17/ 0 赞/ 552 阅读

相关 JavaScript弹出框、对话框、提示框、弹窗总结

JavaScript弹出框、对话框、提示框、弹窗总结。 1、JS的三种最常见的对话框 //====================== JS最常用三种弹出对话框

快来打我*/ 2021年09月20日 10:24/ 0 赞/ 581 阅读