<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>调研表</title>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
}
.STYLE1 {
color: #000000;
font-size: 12px;
font-weight: normal;
}
.STYLE2 {
color: #000000;
font-size: 14px;
font-weight: bold;
}
.STYLE3 {
color: #000000;
font-size: 12px;
font-weight: bold;
}
body,td,th {
font-size: 12px;
}
.STYLE4 {color: #FF0000}
.STYLE5 {
color: #FF0000;
font-weight: bold;
font-size: 18px;
}
-->
</style>
<script type="text/javascript">
//isMuti为是否可以多选 checkname为当前的控件调用时给this就行了 hidden为把值放到哪里个隐藏表单域,为隐藏表单域的id
function checkboxvalue(isMuti ,checkname , hidden ){
var groups = document.getElementsByTagName("input");
var namegroups = new Array();
var index = 0;
for(i = 0 ;i < groups.length ; i++){
if(groups[i].type == "checkbox" && groups[i].name == checkname.name){
namegroups[index] = groups[i];
index++;
}
}
//判断是多选
if(isMuti){
var vals = new Array();
valindex = 0;
for(g = 0 ;g < namegroups.length ; g++){
if(namegroups[g].checked){
vals[valindex] = namegroups[g].id.replace(checkname.name , "");
valindex++;
}
}
document.getElementById(hidden).value = vals.join(",");//设置值格式为1,2,3,4,5
alert(document.getElementById(hidden).value);
}else{
var radioval = "";
//单选
for(g = 0 ;g < namegroups.length ; g++){
if(namegroups[g].id != checkname.id){
namegroups[g].checked = false;
}else{
document.getElementById(hidden).value = namegroups[g].id.replace(checkname.name , "");//设置值
alert(document.getElementById(hidden).value);
}
}
}
}
</script>
</head>
<body>
<table width="750" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<th scope="col"><img src="images/banner.jpg" width="750" height="113" /></th>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><table width="750" border="0" cellspacing="0" cellpadding="0">
<tr>
<th height="30" bgcolor="#FEECBC" scope="col"><span class="STYLE5">产 品 体 验 调 查 表</span></th>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#FF7171">
<tr>
<th width="670" bgcolor="#FFFFFF" scope="col"><table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#FF7171">
<tr>
<th width="136" rowspan="2" bgcolor="#FFDFDD" scope="col"><span class="STYLE2">您的年龄</span></th>
<th width="110" height="30" bgcolor="#FFEBE6" scope="col"><span class="STYLE3">20岁以下</span></th>
<th width="106" bgcolor="#FFEBE6" scope="col">20-30岁</th>
<th width="106" bgcolor="#FFEBE6" scope="col">30-40岁 </th>
<th width="94" bgcolor="#FFEBE6" scope="col">40-50岁 </th>
<th width="106" bgcolor="#FFEBE6" scope="col">50岁以上 </th>
</tr>
<tr>
<td height="25" bgcolor="#FFFFFF"><input id="age1" type="checkbox" name="age" onclick="checkboxvalue(false , this , 'agehidden')" />
<input id="agehidden" type="hidden" name="agehidden" value=""/>
</td>
<td bgcolor="#FFFFFF"><input id="age2" type="checkbox" name="age" onclick="checkboxvalue(false , this , 'agehidden')" /></td>
<td bgcolor="#FFFFFF"><input id="age3" type="checkbox" name="age" onclick="checkboxvalue(false , this , 'agehidden')" /></td>
<td bgcolor="#FFFFFF"><input id="age4" type="checkbox" name="age" onclick="checkboxvalue(false , this , 'agehidden')" /></td>
<td bgcolor="#FFFFFF"><input id="age5" type="checkbox" name="age" onclick="checkboxvalue(false , this , 'agehidden')" /></td>
</tr>
</table></th>
<th width="80" rowspan="5" bgcolor="#FFFFFF" scope="col"><table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="#FF7171">
<tr>
<th width="100%" height="286" bgcolor="#FFFFFF" scope="col"><span class="STYLE1">备注： <br />
请在符合您情况的选项下面打<strong>√</strong>。存在的问题和建议请用文字进行详细说明<strong>。</strong></span></th>
</tr>
</table></th>
</tr>
<tr>
<th width="670" bgcolor="#FFFFFF" scope="col"><table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#FF7171">
<tr>
<th width="137" rowspan="2" bgcolor="#FFDFDD" scope="col"><span class="STYLE2">您的学历</span></th>
<th width="108" height="30" bgcolor="#FFEBE6" scope="col">高中</th>
<th width="106" bgcolor="#FFEBE6" scope="col">大专</th>
<th width="106" bgcolor="#FFEBE6" scope="col">本科 </th>
<th width="96" bgcolor="#FFEBE6" scope="col">硕士</th>
<th width="105" bgcolor="#FFEBE6" scope="col">博士以上 </th>
</tr>
<tr>
<td height="25" bgcolor="#FFFFFF"><input id="education1" type="checkbox" name="education" onclick="checkboxvalue(false , this , 'educationhidden')" />
<input id="educationhidden" type="hidden" name="educationhidden" value=""/>
</td>
<td bgcolor="#FFFFFF"><input id="education2" type="checkbox" name="education" onclick="checkboxvalue(false , this , 'educationhidden')" /></td>
<td bgcolor="#FFFFFF"><input id="education3" type="checkbox" name="education" onclick="checkboxvalue(false , this , 'educationhidden')" /></td>
<td bgcolor="#FFFFFF"><input id="education4" type="checkbox" name="education" onclick="checkboxvalue(false , this , 'educationhidden')" /></td>
<td bgcolor="#FFFFFF"><input id="education5" type="checkbox" name="education" onclick="checkboxvalue(false , this , 'educationhidden')" /></td>
</tr>
</table></th>
</tr>
<tr>
<th bgcolor="#FFFFFF" scope="col"><table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#FF7171">
<tr>
<th width="137" rowspan="2" bgcolor="#FFDFDD" scope="col"><span class="STYLE2">您常用的产品功能</span></th>
<th width="108" height="30" bgcolor="#FFEBE6" scope="col">时间控制</th>
<th width="106" bgcolor="#FFEBE6" scope="col">远程管理</th>
<th width="105" bgcolor="#FFEBE6" scope="col">双屏互动</th>
<th width="97" bgcolor="#FFEBE6" scope="col">内容控制</th>
<th width="105" bgcolor="#FFEBE6" scope="col">上网记录查询</th>
</tr>
<tr>
<td height="25" bgcolor="#FFFFFF"><input id="fun1" type="checkbox" name="fun" onclick="checkboxvalue(true , this , 'funhidden')" />
<input id="funhidden" type="hidden" name="funhidden" value=""/>
</td>
<td bgcolor="#FFFFFF"><input id="fun2" type="checkbox" name="fun" onclick="checkboxvalue(true , this , 'funhidden')" /></td>
<td bgcolor="#FFFFFF"><input id="fun3" type="checkbox" name="fun" onclick="checkboxvalue(true , this , 'funhidden')" /></td>
<td bgcolor="#FFFFFF"><input id="fun4" type="checkbox" name="fun" onclick="checkboxvalue(true , this , 'funhidden')" /></td>
<td bgcolor="#FFFFFF"><input id="fun5" type="checkbox" name="fun" onclick="checkboxvalue(true , this , 'funhidden')" /></td>
</tr>
</table></th>
</tr>
<tr>
<th bgcolor="#FFFFFF" scope="col"><table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="#FF7171">
<tr>
<th width="130" height="50" bgcolor="#FFDFDD" scope="col"><span class="STYLE2">产品BUG（包括页面、功能等等）历</span></th>
<th width="519" colspan="5" bgcolor="#FFFFFF" scope="col"> </th>
</tr>
</table></th>
</tr>
<tr>
<th bgcolor="#FFFFFF" scope="col"><table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="#FF7171">
<tr>
<th width="129" height="50" bgcolor="#FFDFDD" scope="col"><span class="STYLE2">存在的问题及建议</span></th>
<th width="520" colspan="5" bgcolor="#FFFFFF" scope="col"> </th>
</tr>
</table></th>
</tr>
</table></td>
</tr>
</table>
<table width="750" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<th height="40" class="STYLE1 STYLE4" scope="col">备注：参与调查并详细真实完成调查表的用户将有机会获得精美礼品一份。</th>
</tr>
</table>
<table width="750" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<th height="40" class="STYLE1 STYLE4" scope="col"><img src="images/tj.jpg" width="137" height="52" /></th>
</tr>
</table>
</body>
</html>
分享到：
相关推荐
在HTML中，创建一个可多选的下拉框通常涉及到`<select>`元素与`<option>`元素的组合，但为了实现多选功能，我们需要使用`<input type="checkbox">`和自定义的JavaScript或者利用现代浏览器支持的Web组件技术。...
在`ztree`初始化完成后，需要监听用户的选中操作，并根据单选或多选模式更新`layui`下拉框的值。同时，为了提高用户体验，可以添加搜索功能，让用户能够快速定位到目标节点。 这个下拉树组件适用于多种场景，比如在...
在IT领域，Checkbox是用户界面（UI）设计中不可或缺的一部分，尤其在网页和应用程序中用于收集用户的选择。Checkbox，通常称为复选框，允许用户在多个选项中进行选择，可以同时选择一个或多个选项，这与单选按钮...
引用js <!--引用js--> <script src="js/jquery-1.11.2.min.js"></... //参数{input类名，选择类型(单选or多选)} $(".rdolist").labelauty("rdolist", "rdo"); $(".chklist").labelauty("chklist", "check"); });
- `checkType`：选择模式，可选值有`radio`（单选）和`checkbox`（多选）。 - `searchKey`：指定搜索关键字所在的字段名。 - `showLine`：是否显示节点间的连线。 - `onCheck`：节点被选中时触发的回调函数，返回...
在计算机用户界面设计中，单选按钮（Radio Button）和多选按钮（Checkbox）是两种常见的交互元素，用于用户在一组选项中进行选择。本文将深入探讨这两种按钮的原理、功能以及如何在不同编程环境中实现它们的选中、...
在.NET Web开发中，CheckBoxList控件经常用于呈现一组可多选的选项。然而，有时候我们需要将CheckBoxList的功能限制为只能单选，就像单选按钮（RadioButtonList）那样。本篇将详细介绍如何在C#环境下，针对ASP.NET ...
在这个“简单zTree树形，支持单选、多选、移动实例”中，我们将深入探讨zTree的核心功能和应用场景。 zTree是一个轻量级的插件，它通过Ajax技术动态加载数据，可以轻松地与后端服务进行交互，实现数据的动态更新和...
在Cocos Creator中，Checkbox组件是用户界面（UI）中常用的一种元素，它允许用户进行单选或多选操作。在创建交互式游戏或应用时，全选、反选和多选功能是常见的需求，比如设置选项、切换开关等。本文将详细介绍如何...
在网页表单设计中，单选按钮（Radio）、多选框（Checkbox）和下拉框（Dropdown）是常见的数据输入控件。对于这些元素的美化和增强功能，开发人员经常依赖于第三方组件库。标题中提到的“树形下拉框组件”是一种能够...
在HTML中，单选按钮（`<input type="radio">`）和多选按钮（`<input type="checkbox">`）是常见的表单元素。为了实现美化，我们需要为这些元素添加自定义样式，这通常通过类名或者ID来实现，以便在CSS中针对性地进行...
本项目“单选，多选，填空问卷调查实例”旨在提供一个全面的解决方案，涵盖了三种常见类型的问答形式：单选题、多选题和填空题。以下是对这些知识点的详细说明： 1. **单选题**： 单选题是问卷设计中最基础的类型...
Vue.js 是一款轻量级的前端JavaScript框架，它以其易学易用、高效灵活的特点深受开发者...通过这个例子，你可以学习到Vue.js的基础知识，包括组件开发、数据绑定、事件处理等，这些都是构建现代Web应用不可或缺的部分。
在这个场景中，我们关注的是如何在弹出窗口中实现单选、多选以及分页功能。下面将详细讨论这些知识点。 1. **HTML 弹出窗口** HTML弹出窗口通常通过`<dialog>`元素或利用JavaScript库（如jQuery UI或Bootstrap ...
在传统的下拉框中，用户只能单选一个选项，但在含checkbox的多选下拉组件中，用户可以同时选择多个选项，通过复选框（checkbox）来实现。这种设计适用于那些需要用户勾选多项的场景，如筛选条件、兴趣爱好选择等。 ...
这个"jQuery单选多选按钮样式美化代码.zip"文件提供了对单选按钮和多选按钮的视觉样式改进的解决方案，特别适合那些希望提升网站或应用界面美观度的开发者。 首先，让我们深入了解一下jQuery。jQuery是由John Resig...
在ASP.NET开发中，Dropdownlist控件通常用于创建单选下拉列表，而CheckBoxList控件则用于展示可多选的列表项。然而，有时我们需要一个具有多选功能的下拉框，这时可以将Dropdownlist与CheckBoxList结合起来实现这一...
"CSS3单选多选按钮美化特效.zip"是一个针对网页表单中单选按钮（radio button）和多选按钮（checkbox）的美化解决方案，它允许设计师和开发者创造出与各种字体图标相融合的独特按钮样式，从而提升用户界面的视觉吸引...
这通常通过设置zTree的配置参数来实现，例如设置`check.enable`为`true`启用复选功能，然后通过`check.chkStyle`设置为`radio.type`或`checkbox.type`来切换单选或多选模式。 在实际应用中，"数据可以是固定数据或...
本话题主要探讨如何通过一句代码实现动态生成标签栏，并且能够灵活配置标签的位置（左、中、右对齐）以及选择模式（单选或多选）。 首先，动态生成标签是指在程序运行时根据数据或用户需求自动生成标签组件。这种...