Question

我的表格有3个选择框，8个复选框和1个文本字段。

第二个和第三个选择框由先前的选择填充：选择1填充选择2 选择2填充选择3。

当我更改选择2时，选择3将清除...完美！但是，当我更改选择1时，只选择2清除。选择3仍然有值。

<html>
<select id="subject_select" name="subjects" class="chosen-select" data-    placeholder="Select a Subject" style="width:100%;font-size:.85em;" onchange="subject(this.value)">
<option></option>
<option value="1"></option>
<option> ...
</select>
<div id="subject"><select id="subjects_select" class="chosen-select" data-placeholder="Select a Grade" style="width:100%;font-size:.85em;" ></select></div>    
<div id="grade"><select id="standards_select" class="chosen-select" multiple data-placeholder="Select Standard(s)"></select></div>

我的javascript是：

function subject(str) {
    if (str == "") {
        return;
    } else { 
        if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
            xmlhttp.onreadystatechange = function() {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    document.getElementById("subject").innerHTML = xmlhttp.responseText;
                    $("#subjects_select").chosen();
                }
            }
            xmlhttp.open("GET","subject_get.php?subj="+str,true);
            xmlhttp.send();
        }
    }

我尝试过使用document.getElementById('standards_select').value = ""; 和function clear(val) {}以及onfocus="this.form.reset()"一样无济于事。

有人可以就我出错的地方提出建议吗？请不要直接回答这个问题。

Answer 1

我认为您的示例代码缺少相关部分。但是，您可以通过在subject发生更改时手动触发更改事件来解决此问题：

document.getElementById('standards_select').dispatchEvent(new Event("change"));

当选择1更改时，这将另外触发您选择2的常用更改侦听器。

使用onChange清除多个选择和复选框

1 个答案: