<p>多选题</p> <p>下列诗人是唐朝的是（）</p> <input type="checkbox" id="a" name="ren" />A:李白<br> <input type="checkbox" id="b" name="ren"/>B:杜甫<br> <input type="checkbox" id="c" name="ren"/>C:苏轼<br> <input type="checkbox" id="d" name="ren"/>D:王国维<br> <input type="button" value="提交" id="show" onclick="a"/><br> <script type="text/javascript"> var show=document.getElementById("show"); var ren=document.getElementsByName("ren"); var ee="b"+"a"; function a(){ for(var i=0;i<ren.length;i++){ if(ren[i].checked){ ah=ren[i].value; } } if(ah==ee){ alert("答对了"); }else if(ah==""){ alert("还没有选择"); }else{ alert("答错了"); } } </script>这各程序为什么不能实现

时间: 2023-07-21 15:58:33 浏览: 78

这段代码不能实现多选题的判断，原因如下： 1. 变量ee的赋值应该是"b"+"a"，而不是"b" + "a"，因为选项B和选项A的id应该是连在一起的。 2. 在a()函数中，只有选中的选项的value值等于ee才会弹出"答对了"的提示，但这个判断条件是错误的。因为多选题中可以选择多个选项，所以应该将判断条件改为：选中的选项的value值包含ee。 3. 在html代码中，input元素的type属性应该是radio，而不是checkbox，因为多选题中只有一个选项是正确的。 4. 在html代码中，onclick事件应该是onclick="a()"，而不是onclick="a"，因为a是一个函数，需要加上括号才能调用。

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>信息采集</title> <style type="text/css"> body{ text-align: center; } .one{ border: 1px solid black ; width: 300px; height: 200px; text-align: center; } </style> </head> <body><div> <p>账号<input type="text" name="zhanghao"/></p > <p>邮箱<input type="email" name="zhanghao"/></p > <p>密码<input type="password" name="password"/></p > <p>性别：<input type="radio" name="xb" value="a"/>男 <input type="radio" name="xb" value="b" />女</p >  <p>爱好：<input type="checkbox" name="aihao"/>篮球</p > <p>爱好<input type="checkbox" name="aihao"/>爬山</p > <p>爱好<input type="checkbox" name="aihao"/>唱歌</p > <p>爱好<input type="checkbox" name="aihao"/>读书</p > <p>上传<input type="" name="wenjie"/></p > <p>所在城市:<select name="chengshi"> <option value="i">北京</option> <option value="i">南京</option> <option value="i">海南</option> </select></p > <div > <p> <div class="one">个人介绍</div> </p > </div> <p><button type="submit"/>登录</p > <p><button type="reset"/>重置</p > </div> </body> </html>个人介绍的框怎么居中对齐

您可以在样式中加入以下代码，来实现个人介绍框居中对齐： ``` .one{ border: 1px solid black; width: 300px; height: 200px; text-align: center; margin: 0 auto; /* 新增代码 */ } ``` 其中，`margin: 0 auto;` 将自动将元素水平居中对齐。

<div class="wpwz"> <div class="wup_zl_xz"> <span><input type="checkbox" style="margin-left: 5px;">生命值</span> <span><input type="checkbox">攻击速度</span> <span><input type="checkbox">护甲穿透</span> </div> <div class="wup_zl_xz_1"> <span><input type="checkbox" style="margin-left: 5px;">暴击</span> <span><input type="checkbox" >攻击速度</span> <span><input type="checkbox">护甲穿透</span> </div> <div class="wup_zl_xz"> <span><input type="checkbox" style="margin-left: 5px;">法术伤害</span> <span><input type="checkbox">攻击速度</span> <span><input type="checkbox">消耗品</span> </div> <div class="wup_zl_xz"> <span><input type="checkbox" style="margin-left: 5px;">韧性</span> <span><input type="checkbox">法力值</span> <span><input type="checkbox">护甲穿透</span> </div> <div class="wup_zl_xz"> <span><input type="checkbox" style="margin-left: 5px;">生命值</span> <span><input type="checkbox">攻击速度</span> <span><input type="checkbox">附魔</span> </div> <div class="wup_zl_xz"> <span><input type="checkbox" style="margin-left: 5px;">法力回复</span> <span><input type="checkbox">法术吸血</span> <span><input type="checkbox">移动速度</span> </div> <div class="wup_zl_xz"> <span><input type="checkbox" style="margin-left: 5px;">护甲值</span> </div> </div>css代码.wup_zl_xz span{ margin: 10px; } .wup_zl_xz span input{ transform: translateY(2px) translateX(-5px); } .wpwz{ font-size: 12px; } .wup_zl_xz_1 { float: left; margin-top: 10px; } .wup_zl_xz_1 span{ margin: 13px; } .wup_zl_xz_1 span input{ transform: translateY(2px) translateX(-5px); }修改以上代码实现所有input与第一行对齐间距相同

可以将所有的input都设置一个固定的宽度，然后使用flex布局将它们放在同一行，并设置justify-content为space-between，最后将每行的第一个span设置margin-left为0，就可以实现所有input与第一行对齐，间距相同的效果。修改后的CSS代码如下： ``` .wup_zl_xz span { margin: 10px 10px 10px 0; } .wup_zl_xz span input { width: 16px; transform: translateY(2px) translateX(-5px); } .wup_zl_xz_1 { display: flex; margin-top: 10px; justify-content: space-between; } .wup_zl_xz_1 span { margin: 10px 13px 10px 0; } .wup_zl_xz_1 span input { width: 16px; transform: translateY(2px) translateX(-5px); } .wpwz { font-size: 12px; } ```

阅读全文