JS操作Radio与Select

//radio的chang事件,以及获取选中的radio的值
$("input[name=radioName]").on("change",
        function() {
            var val= this.value;
});
//初始化下拉框组件
    function initSelect(id, data) {
        var arr = [];
        for (var i = 0,
        len = data.length; i < len; i++) {
            var item = data[i];
            arr.push("<option value=\"" + item["val"] + "\" other=\"" + item["other"] + "\">" + item["text"] + "</option>");
        }
        var $select = $("#" + id);
        $select.children().remove();
        $select.append(arr.join(""));
    }
//ajax请求
    function ajax(url, msg, callback, paramArr) {
        $.ajax({
            url: url,
            type: ‘post‘,
            dataType: ‘json‘,
            data: paramArr,
            success: function(data) {
                callback.call(null, data);
            },
            error: function() {
                alert(msg);
            }
        });
    }
//将左边的下拉框中选中项添加到右边的下拉框中;将右边下拉框中选中的项删除
    function addOrDel(flag) {
        var $left = $("#left");
        var $right = $("#right");
        if (flag == 0) {
            //添加
            var $select = $left.find("option:selected");
            var $options = $right.children();
            var optionArr = [];
            for (var i = 0,
            len = $options.length; i < len; i++) {
                optionArr.push($options[i].value + "");
            }
            if ($select.length == 0) {
                //当没有指标被选中时
                alert("请先选择指标,再进行添加");
                return;
            }
            var arr = [];
            for (var i = 0,
            len = $select.length; i < len; i++) {
                var item = $select[i];
                var val = item.value;
                if ($.inArray(val, optionArr) != -1) {
                    //是否已存在【根据val查询】
                    continue;
                }
                var other= item.getAttribute("other");
                arr.push("<option value=\"" + val + "\" other=\"" + other+ "\">" + (item.text + "[" + obj.getMc(other)) + "]" + "</option>");
            }
            $right.append(arr.join(""));
        } else {
            //删除
            var $select = $right.find("option:selected");
            if ($select.length == 0) {
                //当没有选中的指标时
                alert("请先选择指标,再进行删除");
                return;
            }
            for (var i = 0,
            len = $select.length; i < len; i++) {
                //一个一个的删除
                var item = $select[i];
                $(item).remove();
            }
        }
    }
//类---类别
    var obj= {
            arr: ["年", "季", "月"],
            getMc: function(type) {
                type--;
                var arr = this.arr;
                var len = arr.length;
                if (type< 0 || type>= len) {
                    return "";
                }
                return arr[type];
            }
        };
时间: 2024-11-05 21:34:00

JS操作Radio与Select的相关文章

JS 操作 radio input(cc问卷管理)

1.选中特定的单选按钮 function showDetail(content){ $("input[name^='radio']").removeAttr("checked"); for(var i=0;i<content.length;i++){ $("#radio"+(i+1)+content.substr(i,1)).attr("checked","checked"); } } 2.手动添加问

jQuery 操作 radio、select、checkbox

<script type="text/javascript"> $(function () { 一.radio 1.获取选中值,三种方法都可以: $('input:radio:checked').val(): $("input[type='radio']:checked").val(); $("input[name='rd']:checked").val(); 2.设置第一个radio为选中值: $('input:radio:firs

JS操作HTML的select标签,内容之间的添加,删除(http://terry-y.iteye.com/blog/178861)

2个select之间的移动,分单个移动和全部移动, 具体情况如下: 样式如下(类似而已,呵呵): a k b >> l c m d >  e f << g h < i Html代码   <script language="javascript"> function add(){ var opt=selectfrom.options; len=opt.length; for(i=len-1;i>-1;i--){ if(opt[i].s

jQuery操作radio、checkbox、select总结

本文转自:http://tiame.iteye.com/blog/1493261 1.radio:单选框 HTML代码: Html代码   <input type="radio" name="radio" id="radio1" value="1" />1 <input type="radio" name="radio" id="radio2" va

jQuery操作radio、checkbox、select 集合

1.radio:单选框 HTML代码: <input type="radio" name="radio" id="radio1" value="1" />1 <input type="radio" name="radio" id="radio2" value="2" />2 <input type="radi

jQuery操作radio、checkbox、select示例

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> jQuery操作radio.checkbox.select示例 </title> <meta name="Generator" con

JS操作select标签

主要利用这个来实现省市区三级联动的 我利用的是ajax,每一次onchange事件都改变相对应的select中的option,数据全是ajax请求服务器查询数据库而来的,效果还可以,在本地测试的时候速度还是可以的,用户基本体会不到带来的轻微卡顿,还有种方式是把数据直接写在本地的js中作为数组存放起来,但是我的数据已经在数据库中,所以这种方式被我否定了,但是我认为这种方式运行速度应该比我的快. 下面是JS操作select的几种用法,常用的我就记录一下. 1.动态创建select function

js操作select控件大全(包含新增、修改、删除、选中、清空、判断存在等)

原文:js操作select控件大全(包含新增.修改.删除.选中.清空.判断存在等) js操作select控件大全(包含新增.修改.删除.选中.清空.判断存在等) js 代码// 1.判断select选项中 是否存在Value="paraValue"的Item        function jsSelectIsExitItem(objSelect, objItemValue) {            var isExit = false;            for (var i

Jquery 操作Html 控件 CheckBox、Radio、Select 控件

在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio.select,用 Jquery 库操作其他会方便很多,下面用Jq对这些控件的操作进行一个全面的代码总结. 一.Jquery 对 CheckBox 的操作: <input id="ckb1" name="ckb" checked="checked" value="0" type="checkbox&q