Analyse der Implementierungsmethode der automatischen Auswahlfunktion von jQuery Select

In diesem Artikel wird die Implementierungsmethode der automatischen Auswahlfunktion jQuery Select anhand von Beispielen analysiert. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

//筛选
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);

Nach Erhalt des Werts wird die Einstellung automatisch ausgewählt.

Nach der Auswahl rufen Sie die Methode change() auf. Die Änderungsmethode zeigt das Auswahlfeld für die nächste Ebene an. Wählen Sie es dann erneut aus und rufen Sie die Methode change() auf. Auf diese Weise werden standardmäßig alle dreistufigen Auswahlfelder angezeigt und ausgewählt.

$(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=&#39;"+myobj[i].id+"&#39;>"+myobj[i].name+"</option>";
      }
      $("#bigclassid").html(strHtml);
      $("#bigclassid").show().change();
    }else{
      $("#bigclassid").html(&#39;<option value=""></option>&#39;).hide();
      $("#smallclassid").html(&#39;<option value=""></option>&#39;).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=&#39;"+myobj[i].id+"&#39;>"+myobj[i].name+"</option>";
      }
      $("#smallclassid").html(strHtml);
      $("#smallclassid").show();
    }else{
      $("#smallclassid").html(&#39;&#39;).hide();
  }
}

Ich hoffe, dass dieser Artikel für alle hilfreich ist, die sich mit der jQuery-Programmierung befassen.

Weitere Informationen zur Analyse der automatischen Auswahlfunktion von jQuery und verwandte Artikel finden Sie auf der chinesischen PHP-Website!