input去除默认值和下拉提示框

已于 2024-01-05 11:03:02 修改
阅读量2.1k 收藏 2
点赞数 1
分类专栏： web前端开发杂记 html 文章标签： 服务器 前端 linux
于 2020-01-13 15:14:11 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ganle/article/details/103958389
版权

一、去除input默认值：

<input type="text" id="inputId" name="inputName" 
onfocus="if (value==defaultValue)value=''" onblur="if(!value)value=defaultValue" />

二、去除input下拉提示框

<form autocomplete="off">
    <input type="text" id="inputId" name="inputName" />
</form>

提示: autocomplete="off" 放在<input>里面无效

暮色岚光
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
模仿google下拉提示框输入框 Ajax 兼容火狐
03-31
此程序使用方便简单、易用灵活 且不限Asp、php、net 更新说明： 1.支持xhtml 2.兼容IE6,IE7,FF 3.支持input显示与value分离【以隐藏域方式提交数据】 4.支持下拉框按钮 5.支持显示结果数量 6.可以一个页面多次使用 7.模拟下拉框不会被select遮挡 8.调用更方便（内核已改为jq插件） 9.皮肤修改方便 ，外置的css样式文件，带有注释说明，任意修改 10.支持键盘方向键按住不放选择 11.解决了延时卡死的现象 12.解决了在有滚动条时，ie6下被表单遮挡的问题 13.支持回调函数。当该插件执行完毕时，执行另外一个指定函数 14.可以自己设置提示框的长度 15.解决了无法获取用户填写默认值的问题 16.当输入框失去焦点时，提示框会自动隐藏
关闭input文本输入框的自动提示功能
热门推荐
hzgang的专栏
03-13 1万+
文本输入框的自动提示功能在浏览器中模式是打开的。有时候我们并不需要自动提示功能，例如需要用户自己再次输入而非自动完成。在IE中可以使用工具-内容-自动完成选项进行设置。  　　将input元素的autocomplete属性设置为off可以关闭自动提示 　　 　　如果所有表单元素都不想使用自动提示功能，只需在表单form上设置autocomplete=off。
飞飞模仿google下拉提示框输入框.rar
07-05
软件介绍 此小程序是模仿Google(sgguest)输入提示框所编写 亦可用于用户注册邮箱时的提示 此程序使用方便简单、易用灵活 且不限Asp、php、net 更新说明： 1.支持xhtml 2.兼容IE6,IE7,FF 3.支持input显示与value分离【以隐藏域方式提交数据】 4.支持下拉框按钮 5.支持显示结果数量 6.可以一个页面多次使用 7.模拟下拉框不会被select遮挡 8.调用更方便（内核已改为jq插件） 9.皮肤修改方便 ，外置的css样式文件，带有注释说明，任意修改 10.支持键盘方向键按住不放选择 11.解决了延时卡死的现象 12.解决了在有滚动条时，ie6下被表单遮挡的问题 13.支持回调函数。当该插件执行完毕时，执行另外一个指定函数 14.可以自己设置提示框的长度 15.解决了无法获取用户填写默认值的问题 16.当输入框失去焦点时，提示框会自动隐藏
Ajax模仿google提示输入框 v1.8
05-30
更新说明： 1.支持xhtml 2.兼容IE6,IE7,FF 3.支持input显示与value分离【以隐藏域方式提交数据】 4.支持下拉框按钮 5.支持显示结果数量 6.可以一个页面多次使用 7.模拟下拉框不会被select遮挡 8.调用更方便（内核已改为jq插件） 9.皮肤修改方便 ，外置的css样式文件，带有注释说明，任意修改 10.支持键盘方向键按住不放选择 11.解决了延时卡死的现象 12.解决了在有滚动条时，ie6下被表单遮挡的问题 13.支持回调函数。当该插件执行完毕时，执行另外一个指定函数 ######V1.7解决问题############ 14.可以自己设置提示框的长度 15.解决了无法获取用户填写默认值的问题 16.当输入框失去焦点时，提示框会自动隐藏 ######V1.8解决问题############ 17.解决了鼠标无法选择的问题 ****************************************************************** 文件使用说明： 在需要使用的页面首先要引用2个js文件 <script src="jquery1.2.6.min.js"></script> <script src="search_suggest.js"></script> 此二文件必须放于调用函数之前 *****************************以下是调用示例*************************： var option = { inputName : "test2", inputText : "测试字符串4", inputValue: "我是值", inputlength:1, url : "search.asp", arrow :1, arrowUrl :"search.asp?aa=nowitest", zIndex:7, fns:function(){alert(3)} } $("#test").suggestShow(option) +++++++解释说明+++++++++++++++++++++++++++++++++++++++++++++++++++++++++ option:为参数设置对象。option内的所有参数可以省略 inputName 表单input的name.即 提交时获取input的name。飞!飞Asp技术乐园也为search.asp页面获取input的name inputText inputName 所显示的数据 inputValue inputName 所提交的数据，当inputValue省略时，inputValue则与inputText相等 url 远程执行获取数据的url arrow 模仿select，使用下拉按钮。飞飞A~sp技术乐园固定值。为1则显示下拉箭头 为0则不显示 arrowUrl 当arrow为1时 ，默认情况下点击下拉按钮所执行的远程搜索页面 zIndex z-index值 inputlength inputName中输入数据的最小长度 suggestWidth 提示框的长度 fns 当执行完该插件时，执行的回调函数 ************************************************************************ search.asp页面介绍： 该页面返回数据必须是xml格式,输出数据数据必须符合以下格式 <response value="1" result ="共2个结果">显示信息</response> 属性介绍： 1.value aa的value值，可以不填。不填value值则取"显示信息" 2.result 显示远程获取的统计结果，可以不填。 3.显示信息 即aa的显示值text值 ************************************************************************
Ajax 模仿google百度提示输入框 v1.8
06-01
Ajax模仿google提示输入框 使用说明 v1.8 本程序由飞飞asp乐园编写 ************************************************* 特别感谢： 一杯白开水 网友 的帮助 版本所提的修改建议 ************************************************* 飞飞Asp乐园 www.ffasp.com QQ:276230416 QQ:72840059 ********************************************* 程序介绍： 本程序官网演示地址：http://www.ffasp.com/content.asp?newsid=1376 转载请注明出处 此小程序是模仿Google(sgguest)输入提示框所编写 亦可用于用户注册邮箱时的提示 此程序使用方便简单、易用灵活 且不限Asp、php、net 更新说明： 1.支持xhtml 2.兼容IE6,IE7,FF 3.支持input显示与value分离【以隐藏域方式提交数据】 4.支持下拉框按钮 5.支持显示结果数量 6.可以一个页面多次使用 7.模拟下拉框不会被select遮挡 8.调用更方便（内核已改为jq插件） 9.皮肤修改方便 ，外置的css样式文件，带有注释说明，任意修改 10.支持键盘方向键按住不放选择 11.解决了延时卡死的现象 12.解决了在有滚动条时，ie6下被表单遮挡的问题 13.支持回调函数。当该插件执行完毕时，执行另外一个指定函数 ######V1.7解决问题############ 14.可以自己设置提示框的长度 15.解决了无法获取用户填写默认值的问题 16.当输入框失去焦点时，提示框会自动隐藏 ######V1.8解决问题############ 17.解决了鼠标无法选择的问题 ****************************************************************** 文件使用说明： 在需要使用的页面首先要引用2个js文件 <script src="jquery1.2.6.min.js"></script> <script src="search_suggest.js"></script> 此二文件必须放于调用函数之前 *****************************以下是调用示例*************************： var option = { inputName : "test2", inputText : "测试字符串4", inputValue: "我是值", inputlength:1, url : "search.asp", arrow :1, arrowUrl :"search.asp?aa=nowitest", zIndex:7, fns:function(){alert(3)} } $("#test").suggestShow(option) +++++++解释说明+++++++++++++++++++++++++++++++++++++++++++++++++++++++++ option:为参数设置对象。option内的所有参数可以省略 inputName 表单input的name.即 提交时获取input的name。也为search.asp页面获取input的name inputText inputName 所显示的数据 inputValue inputName 所提交的数据，当inputValue省略时，inputValue则与inputText相等 url 远程执行获取数据的url arrow 模仿select，使用下拉按钮。固定值。为1则显示下拉箭头 为0则不显示 arrowUrl 当arrow为1时 ，默认情况下点击下拉按钮所执行的远程搜索页面 zIndex z-index值 inputlength inputName中输入数据的最小长度 suggestWidth 提示框的长度 fns 当执行完该插件时，执行的回调函数 ************************************************************************ search.asp页面介绍： 该页面返回数据必须是xml格式,输出数据数据必须符合以下格式 <response value="1" result ="共2个结果">显示信息</response> 属性介绍： 1.value aa的value值，可以不填。不填value值则取"显示信息" 2.result 显示远程获取的统计结果，可以不填。 3.显示信息 即aa的显示值text值 ************************************************************************
input输入框加入id属性后，会自动出现浏览器自带的下拉框，如何屏蔽
wnk1997的博客
05-11 516
具体为啥加了id属性会出现，目前还没发现，可能是公司组件库代码的原因吧。加入 autocomplete=“off” 设置即可。
去掉el-input输入框弹出历史记录框
ZYX10077的博客
10-26 4009
去掉el-input输入框弹出历史记录框 1、输入框在输入内容时会下拉展示浏览器的历史数据 例如“： 解决方案： 1 给input加一个 autocomplete属性，off代表关闭，on代表开启 // autocomplete="off" 就是关闭 autocomplete="on" 就是开启 <el-input v-model="accountForm.idCard" placeholder="请输入身份证号码" :disabled
html input标签清除历史输入记录下拉框
西凉的悲伤博客
07-20 2721
一、在html 中。如果input标签是放在form表单中的话是会有历史记录的。 比如： <!DOCTYPE html> <html> <head> </head> <body > <form action="" method="post"> <input type="text" name="text1" /> <input type="text" name="text2" /&gt
input 清除历史输入记录下拉框
在这个数字革命的时代，我们将引领您穿越去中心化、智能合约、加密货币以及分布式应用程序的世界。无论您是初学者还是经验丰富的区块链开发者，我们都致力于为您提供有价值的信息和见解。
09-18 1583
HTML 的 input 输入框 会有记录功能，下次输入时总是会出现之前输入历史记录的下拉框，但是有时这个历史记录又很不友好，所以需要将历史记录清除，这时一个属性即可搞定 autocomplete="off" <input type="text" autocomplete="off" /> ...
HTML下拉框自动关闭,禁止 input 自动弹出下拉框的方法
weixin_39649490的博客
05-31 1091
经常设计 form 表单的开发应该知道，用户在浏览器中向表单输入信息的时候会被 input 记录下来，以后每次双击 input 文本框时都会展示以前输入过的信息，虽然这样很方便，但会暴露用户的隐私数据。那如何禁止 input 输入框不记录用户输入的信息呢？下面就来说一下！input 中的 autocomplete 属性autocomplete：属性定义input是否启用自动完成功能，也就是我们说的...
飞飞模仿google(suggest)下拉提示框sggestV1.5
12-12
此小程序是模仿Google(sgguest)输入提示框所编写 亦可用于用户注册邮箱时的提示 此程序使用方便简单、易用灵活 且不限Asp、php、net 更新说明： 1.支持xhtml 2.兼容IE6,IE7,FF 3.支持input显示与value分离 4.支持下拉框按钮 5.支持显示结果数量 6.可以一个页面多次使用 7.模拟下拉框不会被select遮挡 8.调用更方便（内核已改为jq插件） 9.皮肤修改方便 ，外置的css样式文件，带有注释说明，任意修改 文件使用说明： 在需要使用的页面首先要引用2个js文件 <script src="jquery1.2.6.min.js"></script> <script src="search_suggest.js"></script> 此二文件必须放于调用函数之前 调用函数 **以下是调用示例**： $("#test2").suggestShow("aa","search.asp","ddd",2,1,1,"search.asp") 函数介绍： test2 必填 需要添加该插件的对象的父Id "aa": 必填 为需要输入信息的input的name search.asp 必填 即为远程页面(数据获取，信息处理页面) ddd 非必填 为"aa"的默认值 2 非必填 z-index isScroll 非必填 下拉框是否有滚动条[1有，0没有，默认0] arrow 非必填 否显示下拉框按钮[1是，0不是，默认0] arrowUrl 非必填 点击下拉框按钮时 执行的远程页面 ************************************************************************ search.asp页面介绍： 该页面返回数据必须是xml格式,输出数据数据必须符合以下格式 <response value="input的value" result ="统计数据">显示信息</response> 属性介绍： 1.value aa的value值，可以不填。飞飞~Asp技术乐园不填value值则取"显示信息" 2.result 显示远程获取的统计结果 3.显示信息 即aa的显示值text值 ************************************************************************ 调用实例： 可以参考 index.asp
控制input输入框提示信息显示和隐藏的方法
chijing5574的博客
03-17 1109
<input type="text" value="搜索" class="search" id="search" onfocus="if(this.value == '搜索'){value =''}" onblur="if (this.value ==''){ value ='搜索'}...
input常见属性和使用方法的介绍
OBKoro1前端分享
03-31 5248
写在前面：老套路有栗子有code，这篇文章是对css中input标签的属性中比较常用常见的使用方法的一个总结。我自己也老是记不住，所以经常百度一下，加深一下印象和为了自己以后查找资料方便，也方便后来的人。 去掉input的边框 栗子： 就是这个东东，原始的样式比较难看，一般都有去掉的需求。 border: none; 已经成功去掉了 去掉鼠
【我不熟悉的html】input框关闭自动填充，以及自动填充的下拉列表，autocomlete=“off“ 、修改name属性
qq_17335549的博客
10-08 1992
【我不熟悉的html】input框的自动填充autocomlete="off"的使用
easyui combobox input 下拉框 加入默认值
八音初穗的博客
03-02 4200
html&lt;td&gt; &lt;input id="textdefaut" class="easyui-combobox" data-options=" url:'/Wx/Get2ComboList', ...
去掉浏览器默认输入提示方法
weixin_33874713的博客
06-14 564
去掉浏览器默认输入提示方法如下： 只需设置autocomplete="off" 就这样简单一行代码就可以阻止浏览器的默认提示菜单遮盖你所自定义的下拉内容。 分类:html-css 转载于:https://www.cnblogs.com/eternityspring/p/4041586.html...
el 消除inpu输入框内容和下拉内容
最新发布
Leijiang0504的博客
01-06 582
输入这个就好了，clearable @clear="getList()" 非常简单。
去除input默认的历史下拉菜单
weixin_39782183的博客
03-08 1503
给input设置autocomplete="off"属性可解决此问题。
input text 去掉标签下拉提示autocomplete
weixin_30501857的博客
05-06 340
autocomplete 属性 autocomplete 属性规定输入字段是否应该启用自动完成功能。 自动完成允许浏览器预测对字段的输入。当用户在字段开始键入时，浏览器基于之前键入过的值，应该显示出在字段中填写的选项。 注释：autocomplete 属性适用于 <form>，以及下面的 <input> 类型：text, search, u...
element ui input框默认值
06-28
### 回答1： Element UI 的输入框默认值可以通过设置 value 属性来实现。例如： ``` <el-input v-model="inputValue" placeholder="请输入内容" :value="defaultValue"></el-input> ``` 其中，defaultValue 是你设置的默认值，可以在 data 中定义： ``` data() { return { inputValue: '', defaultValue: '这是默认值' } } ``` ### 回答2： Element UI 的 input 组件是一种页面表单组件，用于接受用户的输入。对于 input 组件而言，在一些情况下，我们希望在页面加载完成后，输入框中默认有一个预填充的值。有下面两种方法可以设置输入框的默认值。 1. 通过 v-model 实现动态绑定 在 Element UI 的 input 组件中，我们可以使用 v-model 指令来实现 input 标签与 Vue.js 组件中 data 的双向绑定。所以，我们可以把默认的值通过 data 中的属性及 v-model 指令传递给 input 标签。示例代码如下： ```html <template> <el-input v-model="inputValue"></el-input> </template> <script> export default { data() { return { inputValue: '默认值' } } } </script> ``` 2. 通过 props 设置默认值 即使在第一种方法中，我们也可以设置 input 组件的初始值，但更好的做法是通过 props 来设置组件的初始值。Input 组件接受以下 props： - value: 输入框的值 - placeholder: 输入框的占位符 - clearable: 是否可清空 - disabled: 是否禁用 - size: 输入框的尺寸 - medium / small / mini 示例代码如下： ```html <template> <el-input :value="inputValue" placeholder="请输入内容"></el-input> </template> <script> export default { data() { return { inputValue: '默认值' } } } </script> ``` 以上两种方法都可以实现 input 框默认值的设置，但是通过 props 设置默认值更为规范，更加符合组件设计的思想，也更容易维护。 ### 回答3： Element UI是一套基于Vue.js 2.0的桌面UI组件库，能够让开发人员快速地完成开发任务。其中，Element UI Input框是其中的一个重要组件，需要根据不同的业务需求设置默认值。 Element UI Input框的默认值可以通过v-model绑定属性来设置，在Vue.js开发中，v-model指令能够实现双向数据绑定，通过设置v-model的值，不仅可以设置默认值，还可以获取输入框的值，实现数据的动态更新。 设置默认值的方法如下： 1.通过在data中设置默认值来实现 在Vue.js开发中，定义一个变量用于存储默认值，例如在data中定义： data() { return { inputValue: '请输入内容' } } 在Input框中绑定这个变量即可实现默认值的设置： <el-input v-model="inputValue"></el-input> 2.在mounted生命周期中通过ref来设置默认值 Vue.js的mounted生命周期在组件挂在完成之后被调用，此时组件已经完全初始化，可以通过ref属性来获取Input框的DOM元素，从而实现设置默认值。 在Input框中绑定ref属性： <el-input ref="inputRef"></el-input> 在mounted中设置默认值： mounted() { this.$nextTick(() => { this.$refs.inputRef.$refs.input.value = '请输入内容' }) } 以上是Element UI Input框默认值的两种设置方式。无论哪种方式，都能够轻松地实现Input框的默认值设置，方便开发人员进行具体业务的实现。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值