select自动选中

  //筛选
  var typeid = "<!--{$typeid}-->";
  var bigclassid = "<!--{$bigclassid}-->";
  var smallclassid = "<!--{$smallclassid}-->";
  $("#typeid option[value="+typeid+"]").attr("selected",true);
  $("#typeid").change();
  $("#bigclassid option[value="+bigclassid+"]").attr("selected",true);
  $("#bigclassid").change();
  $("#smallclassid option[value="+smallclassid+"]").attr("selected",true);

获取值,后,设置自动选中。

选中之后,调用change()方法。change方法会显示出下一级的select框。然后再选中,再调用change()方法。这样就把三级的select框都显示出来了,并且默认选中了。

$(document).ready(function(){
    //ajax级联
    $("#typeid").change(function(){
        var id = $(this).val();
        setbigclass(id);
    });

    $("#bigclassid").change(function(){
        var id = $(this).val();
        setsmallclass(id);
    });

    $("#screen_submit").click(function(){
        $("#screenform").submit();
    });
});

function setbigclass(id){
        var res = ajaxgetbigclass(id);
        if(res){
            myobj = eval(res);
            var strHtml="<option value=0>全部大类</option>";
            for(var i=0;i<myobj.length;i++){
                   strHtml+="<option value='"+myobj[i].id+"'>"+myobj[i].name+"</option>";
            } 
            $("#bigclassid").html(strHtml);
            $("#bigclassid").show().change();
        }else{
            $("#bigclassid").html('<option value=""></option>').hide();
            $("#smallclassid").html('<option value=""></option>').hide();
        }
}

function setsmallclass(id){
        var res = ajaxgetsmallclass(id);
        if(res){
            myobj = eval(res);
            var strHtml="<option value=0>全部子类</option>";
            for(var i=0;i<myobj.length;i++){  
                   strHtml+="<option value='"+myobj[i].id+"'>"+myobj[i].name+"</option>";
            }  
            $("#smallclassid").html(strHtml);
            $("#smallclassid").show();
        }else{
            $("#smallclassid").html('').hide();
    }
}

 

posted @ 2014-01-11 15:43  TBHacker  阅读(844)  评论(0编辑  收藏  举报