当前位置: 代码迷 >> Web前端 >> jquery征集表单值
  详细解决方案

jquery征集表单值

热度:119   发布时间:2012-08-21 13:00:22.0
jquery收集表单值
1,收集checkbox的值
<script type="text/javascript">
        $(function() {
            //全选
            $("#checkAll").click(function() {
                $("[name='items']:checkbox").attr("checked", true);
            });
            //反选
            $("#checkOpp").click(function() {
                $("[name='items']:checkbox").each(function() {
                    $(this).attr("checked", !$(this).attr("checked"));
                });
            });
            //全不选
            $("#checkNO").click(function() { $("[name='items']:checkbox").attr("checked", false); });
            //选中指定值
            $("#SubmitID").click(function() {
                var Str = "你选中的是:\n\r";
                $("[name='items']:checkbox:checked").each(function() {
                    Str += $(this).val() + "\n\r";
                });
                alert(Str);
            });

        });
    </script>
//我的获取办法
var str_general="";
$("input[name='cb_general_create']:checkbox:checked").each(function(){
	str_general += $(this).val()+";";
})

//达到toggle效果
$("input[name='cb_expect_datetime']:checkbox").click(function(){
    if($("input[name='cb_expect_datetime']:checkbox").attr("checked") == true){
        //$("input[name='cb_expect_datetime']:checkbox").attr("checked",true);
        $("#repair_attach_zone").show();
    }else{
        //$("input[name='cb_expect_datetime']:checkbox").attr("checked",false);
        $("#repair_attach_zone").hide();
    }
});


2,radio表单
<input type="radio" id="cb_expect_datetime" name="cb_expect_datetime" value="repairAtOnce" />
立即报修至厂商&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" id="cb_expect_datetime" name="cb_expect_datetime" checked="checked" value="repairBatch" />
由库管集中报修

$("input[name='cb_expect_datetime']:radio").click(function(){
    if($("input[name='cb_expect_datetime']:checked").val() == 'repairAtOnce'){
        $("#repair_attach_zone").show();
    }else{
        $("#repair_attach_zone").hide();
    }   
}); 


3,收集select的值
//一、最基本
//value
var work_area = $("#outsource_work_area").val();
//text
var s_idc_name = $("#dropdownlist_s_idc_id").find("option:selected").text();

//二、操作option
var option = $("#scheduling_user_id option[value="+user_id+"]");
var display_name = option.text();
option.remove();

//jQuery添加/删除Select的Option项:
$("#select_id").append("<option value='Value'>Text</option>");  //为Select追加一个Option(下拉项)
$("#select_id").prepend("<option value='0'>请选择</option>");  //为Select插入一个Option(第一个位置)
$("#select_id option:last").remove();  //删除Select中索引值最大Option(最后一个)
$("#select_id option[index='0']").remove();  //删除Select中索引值为0的Option(第一个)
$("#select_id option[value='3']").remove();  //删除Select中Value='3'的Option
$("#select_id option[text='4']").remove();  //删除Select中Text='4'的Option


//三、遍历option
var id = $(this).attr("user_id");
var name = $(this).attr("display_name");
var len = $("select[name='scheduling_user_id'] option").length;
var flag = true;
$("select[name='scheduling_user_id'] option").each(function(){
    if(id == $(this).val()){
        flag = false;
    }
});
if(flag){
    var new_option = "<option value='"+id+"'>"+name+"</option>";
    $(new_option).appendTo("#scheduling_user_id");
    $("#new_item_"+id).remove();
}

//四、事件监听
$("#select_id").change(function(){//code...});    //为Select添加事件,当选择其中一项时触发
  相关解决方案