016 - 一二三木头人
本帖最后由 不二如是 于 2018-11-16 09:25 编辑上一集：015 - 你说hello我说hei
http://xxx.fishc.com/forum/201803/20/094616suu10rovsa60kazi.jpg
万众瞩目的零基础入门学习Web开发（H5&C3）开始更新了！！！{:10_298:}
在Web新纪元 |【鱼C#视频课程】剧透这个系列的诞生，时间总是善待任何想拿它搞事情的存在体。
很幸运，一切就这样开始了，开局总会有些不足，但一切在慢慢变好，不是吗？
作为，吹水阁中最爱吹水（爱干无意义事情）的鱼油，整套教程的亮点（槽点）由我来承包～
关注本系列推送（最下方有订阅方式）的鱼油，会享受到一个福利：
会比正常推送，早一个时间节点，看到还未出炉的美味课程
哈哈，废话不多说了，#敲黑板时刻！{:10_281:}
在线视频：传送门
课程思维导图
猛戳http://xxx.fishc.com/forum/201803/31/110408mxpszds1j1xxxahm.gif超清
1、autocomplete属性
autocomplete属性可以规定输入字段是否应该启用自动完成功能。
自动完成允许浏览器预测对字段的输入。
当用户在字段开始输入时，浏览器基于之前输入过的值，显示一个提示框。
既可以为form（表单）元素添加，这样全局下的文本框都会开启该功能：
<form action="welcome.php" method="post" autocomplete="off">
名字：<input type="text" name="name"><br><br>
性别：<input type="text" name="sex"><br><br>
<button type="submit">提交</button>
</form>
友情提醒：
**** Hidden Message *****
当鱼油第一输入过后并提交表单，下次再输入便会看到提示框：
默认情况下或不指定autocomplete属性，则自动开启哦，如需取消则设置：
<form autocomplete="off">
如果需要form元素整体保留自动完成功能，而个别文本框需要不开启，则单独设置autocomplete为flase即可：
<form action="welcome.php" method="post">
名字：<input type="text" name="name" autocomplete="off"><br><br>
性别：<input type="text" name="sex"><br><br>
<button type="submit">提交</button>
</form>
这样表单中除了姓名文本框不会有自动完成功能，其它依旧有。
2、form元素的target属性
form元素的target属性可以规定在何处打开目标URL。
设置target属性，我们可以让服务器响应的页面在指定位置显示，位置有：
_blank 打开新窗口
_self 在相同的框架或窗口中载入目标文档
_parent 把文档载入父窗口或包含了超链接引用的框架的框架集
_top 把文档载入包含该超链接的窗口,取代任何当前正在窗口中显示的框架
framename 在同一个名称的frame框架打开窗口
和我们之前学过的a元素中的玩法有异曲同工之妙哈。
代码：
<form action="welcome.php" method="post"target="_blank">
名字：<input type="text" name="name" autocomplete="on"><br><br>
性别：<input type="text" name="sex"><br><br>
年龄：<input type="text" name="age"><br><br>
<button type="submit">提交</button>
</form>
由于设置了target属性的值为_blank，所以会在新的标签页打开服务器返回结果。
其他的几个属性值不是很常用，使用率很低，知道有需求时去哪里找即可。
3、input元素的value属性
input元素的value属性可以设置元素的文本值。
演示：
性别：<input type="text" name="sex"><br><br>
如果想需要为本框添加默认的值：
性别：<input type="text" name="sex" value="女"><br><br>
稍微拓展一个属性，placeholder属性，用来帮助用户填写输入字段的提示。
设置如下：
性别：<input type="text" name="sex" placeholder="必须要输入哈"><br><br>
placeholder属性只是帮助用户填写输入字段的提示，一旦用户开始键入相应的值，该值便会消失。
4、input元素的autofocus属性
autofocus 属性规定当页面加载时 <input> 元素是否应该自动获得焦点。
默认情况下不指定即认为不需要自动获得焦点，当指定后：
性别：<input type="text" name="sex" autofocus><br><br>
当为表单元素中的多个文本元素指定autofocus属性：
<form action="http://127.0.0.1/test.php" method="post"target="_blank">
性别：<input type="text" name="sex" autofocus><br><br>
年龄：<input type="text" name="age" autofocus><br><br>
<button type="submit">提交</button>
</form>
只会从上往下为第一个设置autofus属性的文本框进行自动聚焦。
5、disabled属性
设置disabled属性，可以禁用目标元素。
例如：
<form action="http://127.0.0.1/test.php" method="post"target="_blank">
性别：<input type="text" name="sex" autofocus><br><br>
年龄：<input type="text" name="age" disabled><br><br>
<button type="submit" disabled>提交</button>
</form>
年龄和按钮都设置了disabled属性，所以都没有反应。
6、input元素的readonly属性
readonly 属性规定输入字段为只读。
只读字段是不能修改的。
不过，用户仍然可以使用 tab 键切换到该字段，还可以选中或拷贝其文本。
只需设置：
年龄：<input type="text" name="age" readonly><br><br>
当然如果直接设置跟disabled属性从效果上没差别，常常还需指定value值：
年龄：<input type="text" name="age" value="30" readonly><br><br>
这样所有填表的用户，年龄默认值都是30而且不能修改。
应用场景就是这种无良公司的须知：
课后作业，完成了吗？
传送门
http://xxx.fishc.com/forum/201803/20/101934b3igkgm9hgbgz0ck.gif
下一集：017 - 虽千万人吾往矣
如果有收获，别忘了评分{:10_281:} ：
http://xxx.fishc.com/forum/201709/19/094516hku92k2g4kefz8ms.gif
这位鱼油，如果喜欢本系列学习笔记，请订阅 专辑☞（传送门）（不喜欢更要订阅{:10_297:} ）
http://xxx.fishc.com/forum/201803/21/151715umqz1qoywp11wjbq.gif
更新啦。怎么没人啊{:10_277:} 小甲鱼啥时候更新咧 阿拉伯烤鱼 支持小甲鱼，小甲鱼快更新啊，等着你的WEB开发课程 kkkk ccc 提醒ing…… 要努力更新呀 支持 {:10_277:} {:5_109:} 3 666666666666666666666666666666666666666 autocomplete 好 1 不二大佬厉害 打卡 看看内容