css学习9

yuezheyue123

于 2019-01-30 10:55:11 发布

阅读量119

点赞数

分类专栏： css

本文链接：https://blog.csdn.net/yuezheyue123/article/details/86700209

版权

css 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

1.form的属性
action:
autocomplete:
enctype:默认application/x-www-form-urlencoded 上传文件multipart/form-data 纯文本text/plain,发送邮件的时候必须设置该类型，否则接受时会出现乱码。
target:_blank _self _parent _top framename

输入性控件input：
属性：
maxlength:最大长度
value：默认值
readonly
disabled
type的类型：password hidden（隐藏域） file（上传文件） checkbox button submit email url number
使用search能够在搜索框后出现X的清空功能。
但是使用range date tel的时候的兼容性并不好

form中可以使用输入域 textarea ,可以做到多行输入，可以设置列数cols，行数rows.
可以设置wrap属性，其中属性值soft表示在提交之后，textarea中的文本不包括换行符。hard表示在提交后文本包括换行符。
设置textarea不能调整大小，就用style=“resize:none”

  <textarea name="" id="" cols="3" rows="3" wrap="hard">

在form中使用select和optgroup和option配合，设计下拉菜单。其中optgroup中的lable属性仅仅是显示，是一个不可选择的伪标题。

 <select name="选择城市" id="">
 	<optgroup label="河北">
   	  <option value="沧州">沧州</option>
	  <option value="衡水">衡水</option>
  </optgroup>
  </select>

2.在form中使用label标签。
可以做到点击label能够让绑定的其他标签获取到焦点。
有两种方法实现。
①使用for属性绑定id

<label for="textid">标签</label>
<input type="text" id="textid">

②使用label标签进行包裹。

<label>
        <input type="radio" name="RadioGroup1" value="男" />
男</label>

3.form中使用datalist进行绑定数据，这样在input获取焦点的时候，就会提示datalist的数据。

<form action="#" method="get" autocomplete="on" >
 <input type="text" list="citylist">
 <input type="submit" value="提交">
 <datalist id="citylist">
   <option value="beijing">beijing</option>
   <option value="hebei">hebei</option>
   <option value="shanxi">shanxi</option>
 </datalist>
</form>

4.表单重写特性
可以使用
formaction:能够重写表单提交的action
formaction:重写表单的action属性
formenctype:
formmethod:
formnovalidate:
formtarget:

例如：

<form action="1.asp" id="testform">
请输入电子邮件地址： <input type="email" name="userid" /><br />
   <input type="submit" value="提交到页面1" formaction="1.asp" />
   <input type="submit" value="提交到页面2" formaction="2.asp" />
   <input type="submit" value="提交到页面3" formaction="3.asp" />
</form>

5.input中使用pattern属性，添加正则表达式。

 <input type="text" name="zip_code" pattern="[0-9]{6}">

在form元素外部的input中使用form属性，绑定form标签的id，当form提交后，也能提交标签外的数据。

<input type="text" name="address1" form="form1">

使用required属性，这样在提交的时候，如果没有填写内容，就不允许提交。

<input type="text" required>

6.在js中获取form表单中name属性获取元素

<head>
<script>
   function f() {
     document.forms["form"]['result'].value=12
 }
</script>
</head>
<body "f()">
<form action="#" method="get" autocomplete="on" name="form" >
  <output name="result">elle</output>
</form>

yuezheyue123

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css学习9

1.form的属性action:autocomplete:enctype:默认application/x-www-form-urlencoded 上传文件multipart/form-data 纯文本text/plain,发送邮件的时候必须设置该类型，否则接受时会出现乱码。target:_blank _self _parent _top framename输入性控件...
复制链接

扫一扫

专栏目录