input的value和placeholder的区别

2024-10-30

input框中value与placeholder的区别

value:是input中预先放置的文字,当鼠标点击之后依然存在,是值的一部分. placeholder:是input中输入位置的默认显示的文字,鼠标点击后仍旧显示,但不属于值,类似于背景.

网站开发进阶(四十四)input type="submit" 和"button"的区别

网站开发进阶(四十四)input type="submit" 和"button"的区别在一个页面上画一个按钮,有四种办法: 这就是一个按钮.如果你不写javascript 的话,按下去什么也不会发生. 这样的按钮用户点击之后会自动提交 form,除非你写了javascript 阻止它. 这个按钮放在 form 中也会点击自动提交,比前两个的优点是按钮的内容不光可以有文字,还可以有图片等多媒体内容.(当然,前两个用图片背景也可以做到).它的缺点是不同的浏览器得到

解决默写浏览器中点击input输入框时，placeholder的值不消失的方法

html中,placeholder作为input的一个属性,起到了在输入框中占位并提示的作用. 但是有一些浏览器,如chrome,当鼠标点击输入框时,placeholder的值不消失,只有输入数据才消失,会使前端用户体验大打折扣. 我们要实现的效果: 点击前点击后关键是js代码: $(function(){ var text; // 全局变量用于保存文本框的内容 $("input").focus(function() { text = $(this).attr("plac

<input type="image"> 和 <img> 用法区别

原文:<input type="image"> 和 <img> 用法区别 w3c定义如下: Image <input type="image" /> 定义图像形式的提交按钮. 必须把 src 属性和 alt 属性与 <input type="image"> 结合使用. <input type="image" src="submit.gif" alt=

HTML 使用CSS 如何去掉文本聚焦框 HTML 使用CSS 如何去掉文本聚焦框 : outline 值设为none 修改input、textarea输入框placeholder样式

HTML 使用CSS 如何去掉文本聚焦框 : outline 值设为none 修改input.textarea输入框placeholder样式兼容性代码: input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color:lightgray; } input:-moz-placeholder, textarea:-moz-placeholder {

css总结4：input 去掉外边框,placeholder的字体颜色、字号

1 input 标签去除外边框: 在进行webAPP开发时,input外边框非常影响美观,去除外边框方法如下: <input style="border: 0px;outline:none;cursor: pointer;" type="text" placeholder="请输入手机号"> 解释: “border: 0px:” 去除 placeholder 外的边框 “outline:none;” “去除点击input框时显示的边框

input type="datetime-local" 时placeholder不显示

一个坑,input的type="datetime-local" 时,电脑上会显示提示,如图 <input type="datetime-local" name="user_date" placeholder="请选择时间" /> 但是,手机上不会显示,就是一片白,加上placeholder也是白费. 添上这段代码,亲测ios可以正常提示提示信息,安卓还是一片白. input[type="datetime-

兼容IE8以下浏览器input表单属性placeholder不能智能提示功能

当前很多表单提示使用了表单属性placeholder,可这属性不兼容IE8以下的浏览器,我自己写了一个兼容处理js // 兼容IE8以下浏览器input不能智能提示功能 if(navigator.appName == "Microsoft Internet Explorer" && (navigator.appVersion.match(/7./i)=="7." || navigator.appVersion.match(/8./i)=="

chrome下input[type=text]的placeholder不垂直居中的问题解决

http://blog.csdn.net/do_it__/article/details/6789699 <input type="text" placeholder="search word" name="p" /> 但是在chrome下显示的search word并不能垂直居中. 后来找了很久终于在stackoverflow上找到了对应的方法. 参考:http://stackoverflow.com/questions/49196

input的button和submit的区别

故事由来: 其实这个问题,昨天已经遇到过,但是昨天是公司的一枚老员工帮助我这个实习生调的,而且我也确(猜)定(测)那枚老员工也不知道这个区别.然后今天又遇到相同问题. 故事梗概: 现在公司里面做一个项目,用到AngularJs框架,我的老大给了我一个接口服务,给我去调用和测试,我部署完项目的包在本地tomcat服务器后,开始写前端的代码,从html到css到JavaScript(用的少)到bootstrap,好.现在前端的静态界面搭出来了.然后用老大给的接口服务去测试,angularJS的是一个

<input type="text">和<textarea>的区别

在我们开发时经常需要用到输入框,通常解决办法就是<input type="text">和<textarea>,那么这两个标签有什么区别呢? 一:<input type="text">标签 text标签是单行文本框,不会换行. 通过size属性指定显示字符的长度,注意:当使用css限定了宽高,那么size属性就不再起作用. value属性指定初始值,Maxlength属性指定文本框可以输入的最长长度. 可以通过width和heig

input框中修改placeholder的样式

有时间input标签的placeholder属性会出现问题,下面是修改placeholder的样式demo input::-webkit-input-placeholder{ color:red; font-size:20px; } input::-moz-placeholder{ /* Mozilla Firefox 19+ */ color:red; font-size:20px; } input:-moz-placeholder{ /* Mozilla Firefox 4 to 18 */

手机端input[type=date]的placeholder不起作用

<div class="input clearfix"> <label class="fl">起始日期</label> <input class="fl text_date" type="date" name="" value="" placeholder="年/月/日" /> </div> <div

当placeholder的字体大小跟input大小不一致，placeholder垂直居中

当placeholder的字体大小跟input大小不一致,实现placeholder垂直居中设计稿的placeholder的样式是这样的输入值的时候大小是这样的最后想要实现的效果是这样的当我这样写的时候 input::-webkit-input-placeholder{ color: #D9D9D9; font-size: 36px; } 效果是这样的,会稍微偏低一点后面我加了一个translate,就可以实现垂直居中 input::-webkit-input-placeholder{

修改input和textarea的placeholder的颜色，限制文本框字数输入

input标签 disabled 和 readonly的区别

需求描述:今天提交代码,老大审了一下,给我指出了一个改正的地方,XXX的详细信息页面(不是修改页面) input的内容是不能改的,给我指出的时候,我立马就知道了这个该怎么改了,加个readonly不就行了 (*^▽^*)^_^. 解决思路:潜意识反应的就是 readonly属性设置为true 但是又想起来了以前好像也用过disabled,前后把这两个都试了一下,效果是一样的,都不能改动了,但是这毕竟是两个属性,肯定是有差别的了,然后就度娘了一下,最后摆链接. 代码:这个就不贴了吧,就是简单

css常用技巧:input提示文字；placeholder字体修改

1 很多网站都需要更改 <input>内部的placeholder 文字颜色属性:下面来介绍下这个技巧. 2 源代码: <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>input输入框提示文字</title> <style> /*修改提示文字的颜色*/ input::-webkit-input-placeholder {

input属性 disabled与readonly的区别

从效果上看源码 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <form> <table> <caption>disabled与readonly的区别</caption> <t

input提示文字；placeholder字体修改

在很多网站上我们都看到input输入框显示提示文字,让我们一起来看看如果在input输入框中显示提示文字.我们只需要在<input>标签里添加:placeholder="提示文字即可". <style> /*修改提示文字的颜色*/ input::-webkit-input-placeholder { /* WebKit browsers */ color: red; } input:-moz-placeholder { /* Mozilla Firefox 4

解决浏览器中点击input输入框时，placeholder的值不消失的方法

版权声明:本文为博主原创文章,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/lianwenxiu/article/details/87898621 <input type="text" placeholder="请输入" οnfοcus="this.placeholder=''" οnblur="this.placeholder='请输入'"

input的value和placeholder的区别

热门专题