input和textarea的区别 input type
大家好，关于input和textarea的区别很多朋友都还不太明白，不过没关系，因为今天小编就来为大家分享关于input type的知识点，相信应该可以解决大家的一些困惑和问题，如果碰巧可以解决您的问题，还望关注下本站哦，希望对各位有所帮助！
微信小程序中textarea与input的问题总结
微信小程序中textarea与input组合使用时的常见问题及解决方案总结如下：
1. bindkeyboardheightchange事件异常触发
当仅为textarea绑定bindkeyboardheightchange事件时，input组件可能意外触发该事件，且携带的参数均为textarea的配置。此问题在安卓设备上必现，目前尚未找到通用解决方案，需通过兼容性测试规避。
2. hold-keyboard属性冲突
若将textarea和input的hold-keyboard属性均设为true，且input的type非text（如number），连续切换输入框会导致键盘上方的“完成”按钮卡住，且无法重新聚焦textarea。安卓设备必现。
解决方案：
通过show-confirm-bar隐藏textarea的完成按钮；将所有input的type统一设为text；避免设置hold-keyboard为true。3. textarea穿透fixed元素
当页面存在fixed定位元素时，textarea可能无视z-index层级关系穿透该元素。安卓设备偶现，且重新编译或预览后可能持续存在，删除小程序后重新安装可能缓解。
解决方案：在需要覆盖textarea时，动态隐藏textarea或替换为view组件。
4. bindfocus事件误触发
仅绑定textarea的bindfocus事件后，若先点击textarea再立即点击input，可能触发textarea的聚焦事件。安卓设备偶现。
解决方案：通过状态管理动态控制聚焦逻辑，并避免将input的type设为number。
5. transition动画导致placeholder闪烁
在键盘抬起过程中手动调整页面位置（如通过bottom或translateY）并设置transition动画时，textarea的placeholder可能闪烁。安卓设备必现。
解决方案：区分机型处理，仅对iOS设备添加transition属性。
6.完成按钮不触发键盘高度事件
绑定bindkeyboardheightchange事件后，点击键盘自带完成按钮时，事件可能不触发。安卓设备偶现，目前无通用解决方案。
7. auto-height高度获取异常
当textarea的auto-height为true时，通过selectComponent获取高度可能返回初始高度或默认高度。iOS和安卓均存在。
解决方案：动态控制auto-height值，或使用定时器延迟获取高度。
8.键盘高度不一致
多次触发bindkeyboardchange事件时，获取的keyboardHeight可能包含或排除完成按钮的高度。安卓设备偶现，无通用解决方案。
9.数据精度问题
通过selectComponent获取元素尺寸或位置时，默认保留16位小数，可能导致动画计算错误。iOS和安卓偶现。
解决方案：手动截取小数点后两位进行计算。
input button 和 button的区别
HTML 4.01规范的Forms部分指名表单有以下几种控制类型：buttons, checkboxes, radio buttons, menus, text input, file select, hidden controls, object controls.其中除了buttons/menus/object controls之外，都是由<input>完成。
我这里说的是<button>和<input>。
<button>和<input>
规范中指名：可以用<button>和<input>来做表单按扭。不同的按钮类型请参考这些元素的详细定义。要注意的是<button>比<input>支持更丰富的表现功能。
一些区别
大家都知道<input>可以这样用（实际上是一定要这样用）：<input type="submit" value="OK"/>，一定要这样闭合。而不是：<input type="submit" value="OK"></input>。因为起始标签为必须，而关闭标签是禁止的。
<button>比<input>更厉害的地方就在于它可以包含内容。它的值并不是写在value属性里，而是包含在标签中。如：<button>OK</button>。<button>的起始标签和关闭标签都是必须的。这样你便获得了样式化的主导权。
你可以这样写：<button><strong>OK</strong>, I do.</button>，甚至是插入图片：<button><img src="button.gif" alt=""/>, it's great.</button>。有点类似于<input type="image">，但是显然强大多了。
最后要注意的是，被<button>包含的图片，不能使用热点地图，即不能<img src="foo.gif" usemap="..."/>，这是不合法的。当然也不能再包含诸如input, select, textarea, label, button, form, fieldset, iframe,和isindex（不推荐使用）元素了。
placeholder和value的区别是什么
input中的value和placeholder区别
由于HTML5的出现，使得表单的功能更加强大，input的功能应用起来更加简单，从value到placeholder。但是由于兼容问题，placeholder只适合在移动端的项目，IE6/7/8不支持，只能用value，或者你可以用其他方法模拟placeholder，具体案例你可以看支付宝和财付通的登录和注册页面。下面分别介绍下value和placeholder的实际应用。
value
如果用的是value，我们想鼠标focus后默认文字消失，移开后默认文字又重现，可以这样来写。
placeholder
如果用的是placeholder，我们就不需要JS了，因为它本身就自带focus和blur功能了。但是有时候设计师给我们的设计稿往往跟默认文字颜色是有区别的，那我们如何改变placeholder默认文字颜色呢，如下：
<input type="text" placeholder="请输入手机号" class="inp-fon">
:-moz-placeholder{/* Mozilla Firefox 4 to 18*/
color:#f00;
}
::-moz-placeholder{/* Mozilla Firefox 19+*/
color:#f00;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder{
color:#f00;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder{
color:#f00;
}
一般都是用以上这种方法来处理，这里就不放demo了，比较简单，如果想看效果，把代码复制到网页里查看。
OK，关于input和textarea的区别和input type的内容到此结束了，希望对大家有所帮助。