一、select多选框赋值

select多选框也称作下拉多选框，通过设置option的selected属性来指定被选中的项。示例代码如下：

    苹果
    橘子
    香蕉
    梨

以上代码中，通过设置option元素的selected属性来指定被选中的项。表示初始值为苹果和香蕉两项。

二、select多选框内容移动

常常需要在两个多选框之间进行内容的移动，将一个多选框中的内容移动到另一个多选框中。示例代码如下：

    苹果
    橘子
    香蕉
    梨

<input type="button" value="→" onclick="moveSelection('srcSelect', 'destSelect')">


<script>
    function moveSelection(sourceId, targetId){
        var src = document.getElementById(sourceId);
        var dest = document.getElementById(targetId);
        for(var i=0; i<src.options.length; i++){
            if(src.options[i].selected){
                dest.appendChild(src.options[i]);
                i--;
            }
        }
    }
</script>

以上代码中，使用JavaScript实现了将一个多选框中的内容移动到另一个多选框中。通过在源多选框中选中需移动的项，然后点击→按钮，即可将选中的项移动到目标多选框中。

三、select多选框在ie为啥出现了光标

在IE浏览器中，当多选框的样式设置为display:none或者visibility:hidden时，会出现光标问题。解决方法如下：

    苹果
    橘子
    香蕉
    梨

<input type="button" value="选择水果" onclick="showSelect()">


<script>
    function showSelect(){
        var select = document.getElementById('fruitSelect');
        var div = document.getElementById('fruitDiv');
        if(div.style.display == 'none'){
            div.innerHTML = select.outerHTML;
            div.style.display = 'block';
            var options = div.getElementsByTagName('option');
            for(var i=0; i<options.length; i++){
                if(options[i].selected){
                    options[i].setAttribute('selected', 'selected');
                }
            }
            select.name = '';
        }else{
            select.name = 'fruit';
            var selectedOptions = div.getElementsByTagName('select')[0].getElementsByTagName('option');
            for(var i=0; i<selectedOptions.length; i++){
                if(selectedOptions[i].selected){
                    selectedOptions[i].setAttribute('selected', 'selected');
                }
            }
            select.outerHTML = div.innerHTML;
            div.style.display = 'none';
        }
    }
</script>

以上代码中，通过将多选框隐藏，并在点击按钮时将其复制到一个div中显示，以避免出现光标问题。

四、select多选框回显

在多选框提交表单后，如果需要回显用户之前选过的值，可以使用以下代码：

    <option value="apple" =0?"selected":""%>>苹果
    <option value="orange" =0?"selected":""%>>橘子
    <option value="banana" =0?"selected":""%>>香蕉
    <option value="pear" =0?"selected":""%>>梨

以上代码中，通过判断数组fruit中是否包含每一个选项的值，如果包含则设置option的selected属性为true，否则为false。

五、select多选框获取值

可以通过以下代码获取多选框中选中的项的值：

var select = document.getElementsByName("fruit")[0];
var selectedValues = [];
for(var i=0; i<select.options.length; i++){
    if(select.options[i].selected){
        selectedValues.push(select.options[i].value);
    }
}
console.log(selectedValues);

以上代码中，通过遍历所有选项，将被选中的选项的值保存到数组中，以便后续使用。

六、select多选框获取最后点击的数据

可以通过下面的代码获取最后点击的选项的值：

var select = document.getElementsByName("fruit")[0];
var lastSelectedValue;
select.onmousedown = function(){
    lastSelectedValue = this.value;
}
console.log(lastSelectedValue);

以上代码中，通过给select注册onmousedown事件，在鼠标点击时保存当前点击的选项的值，以便后续使用。

七、选择select

可以通过下面的代码实现选择一个option：

var select = document.getElementsByName("fruit")[0];
select.selectedIndex = 2;
console.log(select.value);

以上代码中，将selectedIndex属性设置为2，即可选中第3个选项，从而实现选择。

八、select选择框默认值

可以通过给option设置selected属性来设置select选择框的默认值。

    苹果
    橘子
    香蕉
    梨

九、select标签多选

使用multiple属性即可实现select标签的多选功能。

    苹果
    橘子
    香蕉
    梨

以上就是对select多选框的详细阐述，包括赋值、内容移动、光标问题、回显、获取值、获取最后点击的数据、选择、默认值和多选等多个方面。