HTML 单选框内的表单下拉列表

Question

更新：抱歉，从 perl 脚本中删除语法时，我删除了太多。这是到目前为止的代码。我将 "student_name" 发布到 script.pl。这可以以文本形式输入，也可以从您使用单选按钮选择的下拉框中 select 编辑。但它似乎对我不起作用。

     <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------------------------------------ ---------------------------------------------- ---------------------- 我正在尝试创建一个表单，用户可以在其中选中第一个单选按钮并自己输入名称，或者选中第二个按钮和 select 下拉列表中的值并将其传递。出于某种原因，我无法让它正常工作，该值没有通过。我想要在要发布的单选按钮之后输入或 selected 的任何值。

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

    <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>

Answer 1

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

此外，您的 HTML 看起来像是 10 年前写的。使用 CSS 设置元素样式，仅将 table 标记用于真正的 table，而不用于创建元素布局，将属性值放在引号下。

Answer 2

我想你是这个意思

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>

HTML 单选框内的表单下拉列表

HTML Form Dropdown within Radio

html

css

php

forms

radio