收音机中的HTML表格下拉菜单

时间:2015-02-20 15:19:35

标签: php html css forms radio

更新:对不起,当从perl脚本中删除语法时,我删除了一点点。这是迄今为止的代码。我发帖" student_name" to script.pl。这可以以文本形式输入,也可以从下拉框中选择,您可以使用单选按钮选择该下拉框。但它似乎对我没用。

     <form method="post" action="script.pl"> 
     Type Student Name<input type="radio" name="student_name"><input type=text name="student_name" size=50> 
     <b>OR</b>
     Select Student Name<input type="radio" name="student_name">
    <select name="student_name">
     <option value="jack">Jack</option>
    </select>
    </form>

OLD POST --------------------------------------------- -------------------------------------------------- ----------------- 我正在尝试创建一个表单,用户可以检查第一个单选按钮并自己输入名称,或者检查第二个按钮并从下拉列表中选择一个值并将其传递过来。出于某种原因,我无法使其正常工作,价值无法通过。我想要在发布单选按钮后输入或选择的任何值。

输入姓名 ()_______ OR()(下拉框)

    <td width=30% bgcolor=#CEDBE7>Student Name</td>
    <td bgcolor=#CEDBE7 width=70%>
    <input type=radio name=student_name value=><input type=text name=student_name size=50> 

    <b>OR</b>

    <input type=radio name=student_name>
    <select>
     <option value=drop1>drop down option 1</option>
    </select>

2 个答案:

答案 0 :(得分:1)

我认为你的意思是

window.onload=function() { // when the page has loaded
  var rads = document.querySelectorAll('input[name="student_rad"]'); // get all radios with name student_rad
  for (var i=0;i<rads.length;i++) {
    rads[i].onclick=function() { // assign onclick to each
      if (this.id=="inp") { // the one deciding input 
        document.getElementById("stud_sel").selectedIndex=0; // reset select
        document.getElementById("student_name").focus();
      }
    }
  }
  document.getElementById("stud_sel").onchange=function() { // when selecting
    document.getElementById("sel").click(); // click the rad to select it
    document.getElementById("student_name").value=this.value;
  }
  var rad = document.querySelector('input[name="student_rad"][checked]');
  if (rad == null)  {
    document.getElementById("inp").click(); // check default
  }
}
    <td width=30% bgcolor=#CEDBE7>Student Name</td>
    <td bgcolor=#CEDBE7 width=70%>
    <input type="radio" name="student_rad" id="inp"/><input type="text" name="student_name" id="student_name" size=50 /> 

    <b>OR</b>

    <input type="radio" name="student_rad" id="sel" />
    <select id="stud_sel">
     <option value="">Please select</option>
     <option value="Frank">Frank</option>
    </select>

答案 1 :(得分:0)

您的select标签没有name属性。提交表单时,传递的值由元素名称标识。

除此之外,您的HTML看起来就像10年前写的那样。使用CSS来设置元素样式,仅将表标记用于实际表,而不是用于创建元素布局,将属性值放在引号下。