0

我是 JavaScript 新手，我一直在做一项基于在 HTML 和 JavaScript 中创建表单的大学作业。在这个作业中，我被要求根据是否在上一个下拉框中选择了特定选项来设置一个必填字段。

  1. 如果从下拉列表中选择了“UWS Student”或“UWS Staff”，则“Student Number/Staff Number”字段变为必填项，否则不是必填项

  2. 如果选择“UWS 学生”或“UWS 员工”，则“机构/公司”字段必须自动填写“西悉尼大学”

这是我一直在使用的一段：

<b>Registration Category:</b>

<select>
<option value="UWS Student">UWS Student</option>
<option value="Student at another institution">Student at another institution</option>
<option value="UWS Academic">UWS Academic</option>
<option value="Other UWS Staff">Other UWS Staff</option>
<option value="Academic from another Institution">Academic from another      
Institution</option>
<option value="Professional">Professional</option>
<option value="Retired">Retired</option>
</select>

<b>Student Number/Staff Number:</b> <input type="text" name="StudentNumber/StaffNumber">
<br>
<b>Institution/Company:</b> <input type="text" id="txtinstcomp" name="institutioncompany">

</fieldset>

注意：我在“机构/公司”字段上也有一个功能，用于上一个问题，只是为了使提交的文件成为强制性的，如果这很重要的话：

function validateText()
{
var institutioncompany=document.getElementById('txtinstcomp');
if (institutioncompany.value=="")
{
     alert("Institution/company must be filled out");
     return false;
}
}

任何帮助将不胜感激，因为我正在努力掌握 JavaScript

4

1 回答 1

1

您必须添加 Id 属性来选择和输入文本字段，如下所示。

<b>Registration Category:</b>

<select id="cat" onchange="populateInstitution();">
     <option value="UWS Student">UWS Student</option>
     <option value="Student at another institution">
           Student at another institution</option>
     <option value="UWS Academic">UWS Academic</option>
     <option value="Other UWS Staff">Other UWS Staff</option>
     <option value="Academic from another Institution">
           Academic from another Institution</option>
     <option value="Professional">Professional</option>
     <option value="Retired">Retired</option>
</select>
<br>
<b>Student Number/Staff Number:</b> 
<input type="text" id="stNumber" name="StudentNumber/StaffNumber">
<br>
<b>Institution/Company:</b> 
<input type="text" id="txtinstcomp" name="institutioncompany">
<br>
<input type="button" value="submit" onclick="validateText()" />

并有一个像'populateInstitution'这样的javascript函数用于选择字段上的更改事件

function validateText() {
    var institutioncompany = document.getElementById('txtinstcomp').value;
    if (institutioncompany == "") {
        alert("Institution/company must be filled out");
        return false;
    }
    var cat = document.getElementById('cat').value;
    if (cat == "UWS Student" || cat == "Other UWS Staff") {
        if (document.getElementById("stNumber").value == "") {
            alert('StudentNumber/StaffNumber is mandatory');
            return;
        }

    }
}

function populateInstitution() {
    var cat = document.getElementById('cat').value;
    if (cat == "UWS Student" || cat == "Other UWS Staff") {
         document.getElementById('txtinstcomp').value='University of Western Sydney';
    }else{
        document.getElementById('txtinstcomp').value='';
    }
}
于 2013-04-05T07:33:40.917 回答