输入框 | 易学教程

移动端输入框弹出键盘控制

阅读更多关于移动端输入框弹出键盘控制

在移动端，我们公司通过输入框主要收集用户的姓名和电话，以下是对输入框获取焦点时，控制弹出键盘的样式来增强用户体验。输入姓名我们的用户都是中国人，输入用户名为中文，所以弹出键盘是输入中文状态即可，这个时候type = 'text'即可，默认状态下一般都是弹出中文输入键盘，所以可满足有图有真相输入电话/手机这个需要输入数字，所以我们希望它获取焦点时可以弹出数字键盘，第一想到的是把type设置为number，但是在type=number时输入框的右侧会出现两个小按钮，丑丑的，而且点击还可输入负数，用户体验不好。所以我们尝试用样式来去掉这两个小按钮，我们设置webkit的-webkit-inner-spin-button属性以及-webkit-outer-spin-button属性，都设置为-webkit-appearance: none即可。大概样式是这样的类名::-webkit-inner-spin-button { -webkit-appearance: none; } 类名::-webkit-outer-spin-button { -webkit-appearance: none; } 这样可以去掉两个小按钮，但这样一个一个设置太麻烦，所以第二种修改方案是： input[type='number']::-webkit-outer-spin-button, input

layUI输入框控制

阅读更多关于 layUI输入框控制

前端框架使用layUI时，对输入框的控制可以使用layUI封装好的方法，例如： 1.输入框必填：lay-verify="required" 2.输入框为手机号码（输入为11位数字）：lay-verify="required|phone" 来源： https://www.cnblogs.com/zeevy/p/12118615.html

使用Ajax实现百度下拉框

阅读更多关于使用Ajax实现百度下拉框

百度下拉框在使用百度搜索时，在输入框中输入部分文字后，下面会将与该文字相关的词组展示出来，该功能就可以使用ajax来实现。注册输入框的onkeyup事件，该事件触发时，将输入框中填写的内容使用ajax发送到servlet中，在servlet中根据用户的输入去数据库中查询，之后将查询出的数据再发送给jsp中，最后将该数据展示在页面即可。效果图（当然这里页面做的比较简单）：输入一个火字即出现以下效果，并可以点击使文本框中内容变为点击的内容。代码如下(注：其中引用的MyAjax.js在上一个博客）：首先是JSP(baidu.jsp): <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>百度下拉框</title> </head> <body>  <div id="divsearch"> <input type="text" name="name" id="name" /> <input type="submit" value="搜索"> </div>  <div id="tips"

css--iframe元素+表单元素

阅读更多关于 css--iframe元素+表单元素

iframe元素框架页通常用于在网页中嵌入另一个页面 iframe 可替换元素通常行盒通常显示的内容取决于元素的属性 CSS不能完全控制其中的样式具有行快盒的特点表单元素一系列元素，主要用于收集用户数据 input元素输入框 type属性：输入框类型 type: text，普通文本输入框 type：password，密码框 type: date, 日期选择框，兼容性问题 type: search, 搜索框，兼容性问题 type: number，数字输入框 type: checkbox，多选框 type: radio，单选框 value属性：输入框的值 placeholder属性：显示提示的文本，文本框没有内容时显示 input元素可以制作按钮当type值为reset、button、submit时，input表示按钮。 select元素下拉列表选择框通常和option元素配合使用 textarea元素文本域，多行文本框按钮元素 button type属性：reset、submit、button，默认值submit 表单状态 readonly属性：布尔属性，是否只读，不会改变表单显示样式 disabled属性：布尔属性，是否禁用，会改变表单显示样式配合表单元素的其他元素 label 普通元素，通常配合单选和多选框使用显示关联可以通过for属性

jeesite中，jeesite文件上传

阅读更多关于 jeesite中，jeesite文件上传

1.html bizKey :主键 returnPath ：是否是返回文件路径到输入框（默认false），可将路径直接保存到某个字段里 filePathInputId ：设置文件URL存放的输入框的ID，当returnPath为true的时候，返回文件URL到这个输入框，即上传成功后的文档存放路径 fileNameInputId ：设置文件名称存放的输入框的ID，当returnPath为true的时候，返回文件名称到这个输入框 bizType：业务表的上传类型（全网唯一，推荐格式：实体名_上传类型，例如，文章图片：article_photo）（要与controller里面的名字一样） uploadType ="all"：上传文件类型：all、file、image、media，若不设置，则自动根据上传文件后缀获取 <#form:fileupload id="upload" bizKey="${crmFiles.id}" filePathInputId="filePath" returnPath="true" fileNameInputId="uploadFiles" bizType="crmFiles_upload" uploadType="all" class="required" readonly="false"/> <#form:form id="inputForm"

【Bootstrap】bootstrap-datetimepicker日期时间插件

阅读更多关于【Bootstrap】bootstrap-datetimepicker日期时间插件

【bootstrap-datetimepicker】　　datetimepicker是一个比较方便的日期时间插件。有了这个之后，我们可以在类似于表单的地方提供一个友好的日期（时间）输入功能。官方文档：【http://www.bootcss.com/p/bootstrap-datetimepicker/】　　要使用datetimepicker组件，首先引入一些文件： <link href="{% static 'bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css' %}" rel="stylesheet"> <script src="{% static 'bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js' %}"></script> <script src="{% static 'bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js' %}"></script> 　　同样这里没有写出来bootstrap的css和js以及jquery，但都是也要包含的。　　■　　典型应用：　　HTML写成这样： <div class="input-group date"

HTML基础——表单的应用

阅读更多关于 HTML基础——表单的应用

1、表单的构成一个完整的表单由表单控件(表单元素)、提示信息和表单域3个部分构成。表单控件：包含了具体的表单功能项，如单行文本输入框、密码输入框、复选框、提交按钮、搜索框等。提示信息：一个表单中通常还需要包含一些说明性的文字，提示用户进行填写和操作。表单域：相当于一个容器，用来容纳所有的表单控件和提示信息，可以通过它定义、处理表单数据所用程序的url地址及数据提交到服务器的方法。注：如果不定义表单域，表单中的数据就无法传送到后台服务器。 2、创建表单 <form></form>标记被用于定义表单域，即创建一个表单。基本格式： <html> <head> <title>创建表单</title> <meta charset="utf-8"/> </head> <body> <form action="http://www.mysite.cn/index.asp" method="post">  账号:  <input type="text" name="zhanghao" />  密码:  <input type="password" name="mima" />  <input type="submit" value="提交" />  <

vue.js 输入框金额限制

阅读更多关于 vue.js 输入框金额限制

vue.js 输入框金额限制 1、页面（有点丑）： 2、代码： <html> <head> <title>输入框</title> <style> div#table_id{ margin:10px; } .input{ padding:10px } </style> </head> <body> <div id="table_id"> 输入框的内容 <= 99 <br/> <input class="input" type="text" v-model="info.use_fee" @input="changeNumFloat($event)"> </div> </body> <script src="https://cn.vuejs.org/js/vue.js"></script> <script> //let info = {:json_encode($info)}; let info = {'use_fee':99}; //let type_list = {:json_encode($type_list)}; let use_max_price = info.use_fee; new Vue({ el: '#table_id', data() { return { info: info, //type_list: type_list }; }, methods: {

chrome input 输入框去掉黄色

阅读更多关于 chrome input 输入框去掉黄色

-webkit-box-shadow: 0 0 0px 1000px white inset input设置内置阴影，要比你的input本身大来源： https://www.cnblogs.com/huahaiwujiang/p/12018222.html

Unity IOS 软键盘输入框问题

阅读更多关于 Unity IOS 软键盘输入框问题

Unity的软键盘输入框在IphoneX上第一次打开时，有一半会飞到屏幕外面，研究后发现是因为软键盘输入框在计算高度时候没将整个游戏的frame的偏移设置进去，而第一次打开输入框的时候偏移较大，所以飞到界面外面了。知道问题了就好办了，打开Unity导出的IOS工程的Class/UI/Kayboard.mm文件，找到里面的positionInput方法，将 editView.frame = CGRectMake(0, y - kToolBarHeight, kbRect.size.width, kToolBarHeight); 替换为 editView.frame = CGRectMake(0, y - kToolBarHeight - [UnityGetGLView() frame].origin.y, kbRect.size.width, kToolBarHeight); 即可解决。可直接下载该文件替换： https://download.csdn.net/download/yhjsspz/12021727 来源： CSDN 作者： yhjsspz 链接： https://blog.csdn.net/yhjsspz/article/details/103461033

订阅输入框