Maison  >  Article  >  interface Web  >  Comment faire fonctionner la sélection avec jquery ?

Comment faire fonctionner la sélection avec jquery ?

青灯夜游
青灯夜游avant
2019-11-23 17:36:121826parcourir

Comment faire fonctionner la sélection avec jquery ? L'article suivant vous présentera comment utiliser jquery pour effectuer la sélection (obtenir la valeur, définir la sélection). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.

Comment faire fonctionner la sélection avec jquery ?

1. Problèmes de valeur de base

Par exemple688643a40f28db53c6433fdc96e9147f18bb6ffaf0152bbe49cd8a3620346341

1. l'élément

$(".selector").val("pxx");

2. Définissez le texte sur pxx et sélectionnez l'élément

$(".selector").find("option:contains('pxx')").attr("selected",true);

Remarque  : La méthode d'écriture précédente de $(".selector").find("option[text='pxx']").attr("selected",true); était actuellement erronée. a confirmé que l'entrée prend en charge ceci. Un moyen d'obtenir la valeur de l'attribut : "input[text='pxx']", vous avez besoin de "option:contains('pxx')" pour l'obtenir dans select.

Voici une utilisation des crochets. Le signe égal entre crochets est précédé du nom de l'attribut sans guillemets. Souvent, l’utilisation de crochets peut rendre la logique très simple.

3. Obtenir la valeur de l'élément actuellement sélectionné

$(".selector").val();

4. Obtenir le texte de l'élément actuellement sélectionné

$(".selector").find("option:selected").text();

Les deux points sont utilisés ici et maîtriser son utilisation. tirer des conclusions sur d’autres cas sera également utile. Le code devient concis.

2. La cascade de select est souvent utilisée, c'est-à-dire que la valeur de la deuxième sélection change avec la valeur sélectionnée par la première sélection. C'est très simple en jquery.

Tels que :

$(".selector1").change(function(){
     // 先清空第二个
      $(".selector2").empty();
     // 实际的应用中,这里的option一般都是用循环生成多个了
      var option = $("<option>").val(1).text("pxx");
      $(".selector2").append(option);
});

3. jQuery obtient le texte et la valeur sélectionnés par Select :

Explication de la grammaire :

$("#select_id").change(function(){//code...});   //为Select添加事件,当选择其中一项时触发
var checkText=$("#select_id").find("option:selected").text();  //获取Select选择的Text
var checkValue=$("#select_id").val();  //获取Select选择的Value
var checkIndex=$("#select_id ").get(0).selectedIndex;  //获取Select选择的索引值
var maxIndex=$("#select_id option:last").attr("index");  //获取Select最大的索引值

4. jQuery définit le texte et la valeur de Select :

Explication de la grammaire :

$("#select_id ").get(0).selectedIndex=1;  //设置Select索引值为1的项选中
$("#select_id ").val(4);   // 设置Select的Value值为4的项选中
$("#select_id option[text=&#39;jQuery&#39;]").attr("selected", true);   //设置Select的Text值为jQuery的项选中

5. jQuery ajoute/supprime l'élément Option de Select :

Explication de la grammaire :

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

6. valeur radio jquery, valeur de case à cocher, valeur de sélection, sélection radio, sélection de case à cocher, sélection de sélection et

1 Obtenez la valeur d'un ensemble d'éléments radio sélectionnés

var item = $(&#39;input[name=items][checked]&#39;).val();

2 Obtenez le texte de l'élément sélectionné

var item = $("select[name=items] option[selected]").text();

3 Le deuxième élément de la liste déroulante de sélection est Valeur actuellement sélectionnée

$(&#39;#select_id&#39;)[0].selectedIndex = 1;

4 Le deuxième élément du groupe radio radio est la valeur actuellement sélectionnée

$(&#39;input[name=items]&#39;).get(1).checked = true;

7. Obtenez la valeur  :

texte zone de texte :

$("#txt").attr("value"); 

Box de sélection multiple :

$("#checkbox_id").attr("value"); 

Radio de groupe à sélection unique :

$("input[type=radio][checked]").val(); 

Box de sélection déroulante :

$('#sel').val(); 

8. Contrôler les éléments du formulaire :

Zone de texte, zone de texte :

$("#txt").attr("value",&#39;&#39;);//清空内容 
$("#txt").attr("value",&#39;11&#39;);//填充内容

Box à sélection multiple :

$("#chk1").attr("checked",&#39;&#39;);//不打勾 
$("#chk2").attr("checked",true);//打勾 
if($("#chk1").attr(&#39;checked&#39;)==undefined) //判断是否已经打勾

Radio du groupe de radio :

$("input[type=radio]").attr("checked",&#39;2&#39;);//设置value=2的项目为当前选中项

Liste déroulante de sélection :

$("#sel").attr("value",&#39;-sel3&#39;);//设置value=-sel3的项目为当前选中项 
$("<option value=&#39;1&#39;>1111</option><option value=&#39;2&#39;>2222</option>").appendTo("#sel")//添加下拉框的option 
$("#sel").empty();//清空下拉框

9. Déterminez s'il existe une option pour une certaine valeur dans la sélection :

function is_Exists(selectid,value){
  var theid=&#39;#&#39;+selectid;
  var count=$(theid).get(0).options.length;
  var isExist = false;
  for(var i=0;i<count;i++){
    if ($(theid).get(0).options[i].value == value){
      isExist=true;
      break;
    }
  }
  return isExist;
}

Apprentissage recommandé :

Tutoriel jQuery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer