快递单号查询
走到今天，我才发现原来技术之路确实难走！需要忍受痛苦和煎熬，需要放弃很多东西
　　

js动态生成选项之考试系统(一) 

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <title>微冷的雨考试成绩统计系统</title>
    <style type="text/css">
    
      body{
      font-size:30px;
      background:#fff6ed;
      font-family:"楷体";
      }
      
       #container{
        margin:0px auto;
       }
      
       #box{
          /* border:1px solid red; */
          overflow:hidden;
          
       }
       
       #box label{
       margin-top:5px;
       background:#cde6c7;
        width:80px;
        display:inline-block;
        text-align:right;
        margin-left:50px;
       }
    </style>
    <script type="text/javascript">
       //加载完所有的标签，图片和css后执行
        window.onload=function(){
          var row=15;
          var col=2;
         var mybody=document.getElementById('mybody');
         if(col>4){
           mybody.style.width=document.body.scrollWidth+(col-4)*350;
         }
          
         //mybody.style.width="3333px";
          initOptions(row,col);
          //alert(body.documentElement.clientWidth);
        // document.body.scrollWidth=3333;
          var cbxs=document.getElementsByName("rchoice");
          for ( var i = 0; i < cbxs.length; i++) {
             cbxs[i].style.cssText="margin-left:20px;";
          }
        };
        //动态加载答题区控件！
        function initOptions(row,column){
         
           var box=document.getElementById('box');
           //题目编号，从0开始
            var count = 0;
            var mytag; //CheckBox的Tag属性值
           //
            for (var i = 1; i <=row ; i++){  //默认i的值为15
                count++;
                 var mydiv=document.createElement("div");
                  box.appendChild(mydiv);
                  //mydiv.style.border="1px solid blue";
                  // mydiv.style.paddingRight="700px";
                   mydiv.style.overflow="auto";
                for (var j = 1; j <=column; j++){   //默认j的值为2
                     //创建一个label
                    var label=document.createElement('label');
                    
                      //设置座位号
                    if (j == 1)
                    {
                        label.innerHTML = count+ "题";
                         mytag = count;
                    }
                    else
                    {
                        //多列的情况下创建题目编号的方式
                        label.innerHTML = (count +row*(j-1)) + "题";
                        mytag = count + row*(j-1);
                    }
                    var littlediv=document.createElement("div");
                    littlediv.style.float="left";
                    
                    //littlediv.style.border="3px solid blue";
                    mydiv.appendChild(littlediv);
                    littlediv.appendChild(label);
                    //创建四个选项
                    var checkbox1=document.createElement("input");
                    checkbox1.setAttribute("type","checkbox");
                    checkbox1.setAttribute("value","A:"+mytag);
                    checkbox1.setAttribute("name","rchoice");
                    var cbtxt=document.createTextNode("A");
                    littlediv.appendChild(checkbox1);
                    littlediv.appendChild(cbtxt);
                   
                    //第二个checkbox
                      var checkbox2=document.createElement("input");
                    checkbox2.setAttribute("type","checkbox");
                    checkbox2.setAttribute("value","B:"+mytag);
                    checkbox2.setAttribute("name","rchoice");
                    var cbtxt2=document.createTextNode("B");
                    littlediv.appendChild(checkbox2);
                    littlediv.appendChild(cbtxt2);
                    //第三个checkbox
                      var checkbox3=document.createElement("input");
                    checkbox3.setAttribute("type","checkbox");
                    checkbox3.setAttribute("value","C:"+mytag);
                    checkbox3.setAttribute("name","rchoice");
                    var cbtxt3=document.createTextNode("C");
                    littlediv.appendChild(checkbox3);
                    littlediv.appendChild(cbtxt3);
                    
                     //第四个checkbox
                      var checkbox4=document.createElement("input");
                    checkbox4.setAttribute("type","checkbox");
                    checkbox4.setAttribute("value","D:"+mytag);
                    checkbox4.setAttribute("name","rchoice");
                    var cbtxt4=document.createTextNode("D");
                    
                    littlediv.appendChild(checkbox4);
                    littlediv.appendChild(cbtxt4);
                    var myline=document.createElement("br");
                   
                    if(j==column){
                        mydiv.appendChild(myline);
                    }
              }
           }
           
        }
    </script>
  </head>
  
  <body id="mybody">
     <div id="container">
         <!-- <fieldset>
          <legend>答题区 :本软件由微冷的雨出品!如有问题，请发送反馈信息到：yymqqc@126.com</legend> -->
          <div id="box">
                 
          </div>
         <!-- </fieldset> -->
     </div>
  </body>
</html>

 

posted @ 2015-10-23 19:41  微冷的雨  阅读(2695)  评论(2)  编辑  收藏  举报