列表框选择“计数不起作用”不起作用

listbox select count not work dont work

本文关键字：不起作用 选择 列表      更新时间：2023-09-26

>我最近试图制作一个带有多选框的表单。当有人选择选项时，所选选项的数量将显示在另一个文本上。我是JavaScript的初学者。

将调用该函数，但不计算所选选项的数量。

<select name="element_17_1[ ]"
        size="7" multiple="multiple"
        class="element select medium"
        id="element_17_1[ ]"
        onfocus="selectCount(this.form);"
        onClick="selectCount(this.form);"
    >
    <option value="Opt1">Opt1</option>
    <option value="Opt2">Opt2</option>
    <option value="Opt3">Opt3</option>
    <option value="Opt4">Opt4</option>
    <option value="Opt5">Opt5</option>
    <option value="Opt6">Opt6</option>
    <option value="Opt7">Opt7</option>
</select>

这是我在<head>中尝试的功能 

function selectCount(f) {
    var selObj = myForm.elements['element_17_1[]'];
    var totalChecked = 0;
    for (i = 0; i < selObj.options.length; i++) {
        if (selObj.options[i].selected) {
            totalChecked++;
        }
    }
    f.element_9.value = totalChecked;
}

您正在尝试获取名为 element_17_1[] 的元素，但您的选择框名为 element_17_1[ ] 。 JavaScript 只是将名称视为一堆字符，而这个空格会有所不同。

在你的HTML中，你有：

> <select name="element_17_1[ ]"
>          size="7" multiple="multiple"
>          class="element select medium"
>          id="element_17_1[ ]"
>          onfocus="selectCount(this.form);"
>          onClick="selectCount(this.form);"
>      >

请注意，在侦听器中，this引用元素本身，因此只需传递它：

           onfocus="selectCount(this);"
           onClick="selectCount(this);"

因此，对元素的引用直接传递给函数，可以是：

function selectCount(selObj) {
    // The following line isn't needed now
    // var selObj = myForm.elements['element_17_1[]'];
    var totalChecked = 0;
    for (i = 0; i < selObj.options.length; i++) {
        totalChecked += selObj.options[i].selected? 1 : 0;
    }
    // The next line needs the form, so
    selObj.form.element_9.value = totalChecked;
}

现在你不在乎选择元素叫什么了。

编辑

要单击element_9您可以执行以下操作：

<input name="element_9" onclick="
 this.value = selectCount(this.form['element_17_1[ ]']);
">

然后将函数修改为：

function selectCount(selObj) {
    var totalChecked = 0;
    for (i = 0; i < selObj.options.length; i++) {
        totalChecked += selObj.options[i].selected? 1 : 0;
    }
    return totalChecked;
}

现在作业够了。

更改选择的名称name="element_17_1"和 id id="element_17_1"，并且您的函数中也没有myForm，因此应该var selObj = myForm.elements['element_17_1']; var selObj = f.elements['element_17_1'];并且您只能在事件中使用，如下所示

onChange="selectCount(this.form);"

而不是

onfocus="selectCount(this.form);"
onClick="selectCount(this.form);"

功能齐全：

function selectCount(f) {
    var selObj = f.elements['element_17_1'];
    var totalChecked = 0;
    for (i = 0; i < selObj.options.length; i++) {
        if (selObj.options[i].selected) {
            totalChecked++;
        }
    }
    f.element_9.value = totalChecked;
}

更新：

为了您的php script，您可以将选择的名称保留name="element_17_1[]"，因此在函数中它应该是var selObj = f.elements['element_17_1[]'];的，但没有像[ ]这样的空格

演示。

相关文章：