Question

我有一个如下所示的多选组合框。

我需要存储所有选择的项目，例如此字符串Very Cold :+: Very Hot

<select name="MilkShake" id="MilkShake" onchange="changeselectItems(this,'MilkShake');">
    <option value="Very Cold">Very Cold </option>
    <option value="Very Hot">Very Hot </option>
    <option value="Med Size">Med Size </option>
    <option value="Large Size">Large Size </option>
    <option value="1 by 2">1 by 2 </option>
    <option value="1 by 4">1 by 4 </option>
    <option value="2 by 3">2 by 3 </option>
    <option value="Glass">Glass </option>
</select>

我尝试过使用此功能

function changeselectItems(ref,miniproname)
{
var ref = ref.value;
    var newf = Array();
    alert(ref);
for(var i=0;i<newexampleitem.length;i++)
    {
        newf['sel'] = ref[i];
    }   

}

Answer 1

你可以使用这样的东西

HTML

<select name="MilkShake" multiple id="MilkShake" 
onblur = "changeselectItems()">
    <option value="Very Cold">Very Cold </option>
    <option value="Very Hot">Very Hot </option>
    <option value="Med Size">Med Size </option>
    <option value="Large Size">Large Size </option>
    <option value="1 by 2">1 by 2 </option>
    <option value="1 by 4">1 by 4 </option>
    <option value="2 by 3">2 by 3 </option>
    <option value="Glass">Glass </option>
</select>

JS

function changeselectItems() {
    var selVal = "";
    var selObj = document.getElementById("MilkShake");

    for (i = 0; i < selObj.options.length; i++) {
        if (selObj.options[i].selected) {
            if (selVal != "") {
                selVal = selVal + " :+: " + selObj.options[i].value;
            } else {
                selVal = selObj.options[i].value;
            }

        }
    }

    alert(selVal);
}

<强> Working DEMO

Answer 2

也许你想在你的标签中添加“multiple”属性，如下所示：。这使您可以通过按住CTRL键来选择多个项目。

以下是我的解决方案：

    <html>
    <head></head>
    <body>
        <form name="SelectForm">
            <select multiple name="MilkShake" id="MilkShake" onchange="changeselectItems(this);">
                <option value="Very Cold">Very Cold </option>
                <option value="Very Hot">Very Hot </option>
                <option value="Med Size">Med Size </option>
                <option value="Large Size">Large Size </option>
                <option value="1 by 2">1 by 2 </option>
                <option value="1 by 4">1 by 4 </option>
                <option value="2 by 3">2 by 3 </option>
                <option value="Glass">Glass </option>
            </select>
        </form>

        <script>
        function changeselectItems(el)
        {
            var myForm = document.forms.SelectForm;
            var data = "";
            for(i = 0; i < myForm.MilkShake.length; i++)
            {
                if(myForm.MilkShake[i])
                {
                    if(myForm.MilkShake[i].selected)
                    {
                        //here are all the selected items
                        if(data != "") data+= " : ";
                        data+= myForm.MilkShake[i].value;
                    }
                }
            }

            alert(data);
        }
        </script>
    </body>
    </html>

在Javascript中多选择组合框到字符串转换

2 个答案: