JAVASCRIPT之多选值排序

最新推荐文章于 2022-09-26 12:10:10 发布

相思比梦长

最新推荐文章于 2022-09-26 12:10:10 发布

阅读量474

点赞数 1

分类专栏： WEB前端文章标签： JAVASCRIPT 多选值排序

本文链接：https://blog.csdn.net/netuser1937/article/details/54965273

版权

WEB前端专栏收录该内容

114 篇文章 2 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JAVASCRIPT之多选值排序</title>
</head>

<body>
<input name="multi[]" type="checkbox" value="a" οnclick="multiselect(this)" />
A
<input name="multi[]" type="checkbox" value="b" οnclick="multiselect(this)" />
B
<input name="multi[]" type="checkbox" value="c" οnclick="multiselect(this)" />
C
<input name="multi[]" type="checkbox" value="d" οnclick="multiselect(this)" />
D
<input type="text" id="answers" value="" />
<script language="javascript">
    function multiselect(obj){
        var ansobj = document.getElementById("answers");
        var selval = obj.value.toUpperCase();
        var ansval_arr = new Array();
        var ansval = '';
        ansval = ansobj.value;
        if(obj.checked){
            if(ansval == "undefined" || ansval == ''){
                ansval = ansval + selval;
            }else{
                ansval = ansval + ',' + selval;
            }
        }else{
            ansval_arr = ansval.split(',');
            for(var i = 0; i < ansval_arr.length; i++){
                if(ansval_arr[i] == selval){
                    ansval_arr.splice(i,1);
                }
            }
            ansval = ansval_arr.toString();
        }
        ansval = ansval.split(',').sort();
        ansobj.value = ansval;
    }
    </script>
</body>
</html>