jQuery-paramétrage de la valeur sélectionnée d'un contrôle select via sa description textuelle
j'ai un contrôle select, et dans une variable javascript j'ai une chaîne de texte.
en utilisant jQuery je veux définir l'élément sélectionné du contrôle select pour être l'élément avec la description du texte que j'ai (par opposition à la valeur, que je n'ai pas).
je sais que le définir par valeur est assez trivial. par exemple
$("#my-select").val(myVal);
mais je suis un peu perplexe sur le fait de le faire via la description du texte. Je suppose qu'il doit y avoir un moyen de obtenir la valeur de la description de texte, mais mon cerveau est trop vendredi après-midi-ed pour être en mesure de résoudre.
19 réponses
compte tenu de ce HTML:
<select>
<option value="0">One</option>
<option value="1">Two</option>
</select>
Sélectionner par description pour jQuery v1.6+:
var text1 = 'Two';
$("select option").filter(function() {
//may want to use $.trim in here
return $(this).text() == text1;
}).prop('selected', true);
Sélectionner par description pour les versions de jQuery inférieures à 1,6 et supérieures ou égales à 1,4 : https://stackoverflow.com/a/3644500/31532
var text1 = 'Two';
$("select option").filter(function() {
//may want to use $.trim in here
return $(this).text() == text1;
}).attr('selected', true);
noter que bien que cette approche fonctionnera dans les versions qui sont au-dessus de 1.6 mais moins que 1.9, il est déprécié depuis 1.6. ne fonctionne pas en jQuery 1.9+.
sélectionner par description pour les versions précédentes:
val()
devrait traiter les deux cas. N'êtes-vous pas le voir?
par exemple:
$('select').val('1'); // selects "Two"
$('select').val('Two'); // also selects "Two"
je n'ai pas testé, mais cela pourrait fonctionner pour vous.
$("select#my-select option")
.each(function() { this.selected = (this.text == myVal); });
essayez ceci...pour sélectionner l'option avec le texte myText
$("#my-Select option[text=" + myText +"]").attr("selected","selected");
je le fais de cette façon (jquery 1.9.1)
$("#my-select").val("Dutch").change();
Remarque: n'oubliez pas le changement(), j'ai dû chercher pour longtemps, parce que :)
$("#myselect option:contains('YourTextHere')").val();
retournera la valeur de la première option contenant votre description textuelle. Testé et fonctionne.
pour éviter toutes les complications de la version jQuery, je recommande honnêtement d'utiliser l'une de ces fonctions javascript très simple...
function setSelectByValue(eID,val)
{ //Loop through sequentially//
var ele=document.getElementById(eID);
for(var ii=0; ii<ele.length; ii++)
if(ele.options[ii].value==val) { //Found!
ele.options[ii].selected=true;
return true;
}
return false;
}
function setSelectByText(eID,text)
{ //Loop through sequentially//
var ele=document.getElementById(eID);
for(var ii=0; ii<ele.length; ii++)
if(ele.options[ii].text==text) { //Found!
ele.options[ii].selected=true;
return true;
}
return false;
}
je sais que c'est un vieux post, mais je n'ai pas pu le faire sélectionner par texte en utilisant jQuery 1.10.3 et les solutions ci-dessus. J'ai fini par utiliser le code suivant (variation de la solution de spoulson):
var textToSelect = "Hello World";
$("#myDropDown option").each(function (a, b) {
if ($(this).html() == textToSelect ) $(this).attr("selected", "selected");
});
J'espère que ça aidera quelqu'un.
Cette ligne de travail:
$("#myDropDown option:contains(myText)").attr('selected', true);
$("#Test").find("option:contains('two')").each(function(){
if( $(this).text() == 'two' ) {
$(this).attr("selected","selected");
}
});
l'instruction if fait une correspondance exacte avec "deux" et "deux trois" ne correspondra pas
la façon la plus facile avec 1.7+ est:
$("#myDropDown option:text=" + myText +"").attr("selected", "selected");
1.9+
$("#myDropDown option:text=" + myText +"").prop("selected", "selected");
testé et fonctionne.
regardez le jQuery selectedbox plugin
selectOptions(value[, clear]):
sélectionnez options by value, en utilisant une chaîne de caractères comme paramètre $("#myselect2").selectOptions("Value 1");
, ou une expression régulière $("#myselect2").selectOptions(/^val/i);
.
vous pouvez également effacer les options déjà sélectionnées: $("#myselect2").selectOptions("Value 2", true);
sur une note. Ma valeur sélectionnée n'était pas définie. Et j'ai eu de recherche sur le net. En fait, j'avais pour sélectionner une valeur après l'appel d'un service web, parce que je recevais des données.
$("#SelectMonth option[value=" + DataFromWebService + "]").attr('selected', 'selected');
$("#SelectMonth").selectmenu('refresh', true);
donc le rafraîchissement du sélecteur était la seule chose qui me manquait.
j'ai trouvé qu'en utilisant attr
vous finiriez avec plusieurs options sélectionnées quand vous ne vouliez pas - la solution est d'utiliser prop
:
$("#myDropDown option:text=" + myText +"").prop("selected", "selected");
j'ai eu un problème avec les exemples ci-dessus, et le problème a été causé par le fait que mes valeurs de boîte de sélection sont pré-remplies avec des chaînes de longueur fixe de 6 caractères, mais le paramètre étant passé dans n'était pas la longueur fixe.
j'ai une fonction rpad qui va droit pad une corde, à la longueur spécifiée, et avec le caractère spécifié. Donc, après avoir rembourré le paramètre ça marche.
$('#wsWorkCenter').val(rpad(wsWorkCenter, 6, ' '));
function rpad(pStr, pLen, pPadStr) {
if (pPadStr == '') {pPadStr == ' '};
while (pStr.length < pLen)
pStr = pStr + pPadStr;
return pStr;
}
$('#theYear').on('change', function () {
FY = $(this).find('option:selected').text();
$('#theFolders').each(function () {
$('option:not(:contains(' + FY + '))', this).hide();
});
$('#theFolders').val(0);
});
$('#theYear').on('mousedown', function () {
$('#theFolders option').show().find('option:contains("Select")', this).attr('selected', 'selected');
});
ici, c'est très simple. plz utiliser
$("#free").val("y").change();
obtenir les enfants de la boîte de sélection; boucle à travers eux; lorsque vous avez trouvé celui que vous voulez, définissez-le comme l'option sélectionnée; retour false pour arrêter la boucle.
accepté Cette réponse ne semble pas correcte, tandis que .val ('newValue') est correct pour la fonction, essayer de récupérer un select par son nom ne fonctionne pas pour moi, j'ai dû utiliser l'id et le nom de classe pour obtenir mon élément
est une option facile. Il suffit de définir votre option de liste puis de définir son texte comme valeur sélectionnée:
$("#ddlScheduleFrequency option").selected(text("Select One..."));