前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >前端|如何制作调查问卷

前端|如何制作调查问卷

作者头像
算法与编程之美
发布2020-07-16 12:55:30
2.8K0
发布2020-07-16 12:55:30
举报
文章被收录于专栏:算法与编程之美

问题描述

随之时代的进步,电子文档逐渐代替了纸质文档。电子文档不仅方便提交反馈而且便于存放。现在很多的公司、学校都会做许多调查(市场调查,学习调查等),为了便于收集,大多数都采用网页调查问卷。那么如何通过网页制作一张调查问卷呢?

解决方案

调查问卷简而言之就是一张表单,所以要制作一张调查问卷就需要掌握表单的一些标签。例如单选按钮、复选框、文本框以及提交按钮这些基本标签。再根据整个页面的排版来设置标签的属性,让问卷美观。

涉及网页的一些基本标签在这就不一一描述,下面主要介绍表单的标签

(1)单选按钮

<form>表单标签

<input type="radio"> 标签定义了表单单选框选项

name:规定识别表单的名称

value:表示该单选框的真实值(一般真实值和数据库对应,显示值给用户参考的)

<br>换行

表1

<form> <input type="radio" name="text" value="公募运作管理规范……">公募运作管理规范……<br> <input type="radio" name="text" value="公募基金有比较强……">公募基金有比较强……<br> <input type="radio" name="text" value="公募基金投资门槛……">公募基金投资门槛……</form>

图1

(2)复选框

<input type="checkbox"> 定义复选框. 用户需要从若干给定的选择中选取一个或若干选项。

表2

<form> <input type="checkbox" name="text" value="产品设计理念">产品设计理念<br> <input type="checkbox" name="text" value="投资思路">投资思路<br> <input type="checkbox" name="text" value="基金经理介绍">基金经理介绍<br> <input type="checkbox" name="text" value="购买渠道">购买渠道<br> <input type="checkbox" name="text" value="购买费单">购买费单</form>

图2

(3)文本框

<input type="text">定义文本框

font-size:15pt 定义文本框字的大小

<textarea rows="5" cols="30"> 定义窗体中加入多少列的文字。

表3

<form> <p> 姓名: <input style="width:110px;height:28px;font-size:15pt;"type="text" name="姓名"> </p> <p> 手机: <input style="width:180px;height:28px;font-size:15pt;" type="text" name="手机"> </p> <p> 地址: <input style="width:250px;height:28px;font-size:15pt;"type="text" name="地址"> </p> 建议: <textarea rows="5" cols="30" style="font-size:15pt"></textarea></form>

图3

(4)提交按钮

<input type="submit"> 定义了提交按钮.

action="" 定义输入数据传送到的地址

空格占位

表4

<form action="" > <input type="button" value="提交"> <input type="button" value="重置"></form>

图4

结语

调查问卷的制作需要掌握很多的表单标签,在设置文本框的时候要合适的调整框的大小和容纳量。在写代码的时候一定要注意缩进,每个部分要区分开来,确保其可读性和美观性。这样也是为了后续的检查。

END

主 编 | 王文星

责 编 | 江汪霖

where2go 团队

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2020-07-14,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 算法与编程之美 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档