jQuery - встановлення вибраного значення елемента управління за допомогою його текстового опису

У мене є елемент управління, а у змінній javascript - текстовий рядок.

Використовуючи jQuery, я хочу встановити, що вибраний елемент керування select є елементом із текстовим описом, який я маю (на відміну від значення, якого у мене немає).

Я знаю, що встановити його за значенням досить тривіально. напр

$("#my-select").val(myVal);

Але я трохи спотикаюся робити це через опис тексту. Я думаю, що повинен бути спосіб отримати значення з тексту опису, але мій мозок занадто п’ятницю вдень, щоб можна було це розробити.

Виберіть за описом jQuery v1.6 +

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).prop('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Версії jQuery нижче 1,6 і більше 1,4 або більше

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).attr('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Зауважте, що хоча цей підхід працюватиме у версіях, що перевищують 1,6, але менше 1,9, він з 1,6 року був застарілим. Він не працюватиме в jQuery 1.9+.

Попередні версії

val() повинні вирішувати обидва випадки.

$('select').val('1'); // selects "Two"
$('select').val('Two'); // also selects "Two"

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Я цього не перевіряв, але це може працювати для вас.

$("select#my-select option")
   .each(function() { this.selected = (this.text == myVal); });

Спробуйте це ... щоб вибрати опцію з текстом myText

$("#my-Select option[text=" + myText +"]").prop("selected", true);

Я роблю це таким чином (jQuery 1.9.1)

$("#my-select").val("Dutch").change();

Примітка: не забудьте про зміну (), мені довелося шукати довго через це :)

$("#myselect option:contains('YourTextHere')").val();

поверне значення першого варіанту, що містить ваш опис тексту. Випробував це і працює.

Щоб уникнути всіх ускладнень версії jQuery, я щиро рекомендую використовувати одну з цих дійсно простих функцій javascript ...

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;
}

Я знаю, що це стара публікація, але я не міг змусити її вибирати текст за допомогою jQuery 1.10.3 та рішення вище. Я в кінцевому рахунку використовував наступний код (варіація рішення Спаульсона):

      var textToSelect = "Hello World";

      $("#myDropDown option").each(function (a, b) {
            if ($(this).html() == textToSelect ) $(this).attr("selected", "selected");
        });

Сподіваюся, це комусь допоможе.

Ця лінія працювала:

$("#myDropDown option:contains(myText)").attr('selected', true);

 $("#Test").find("option:contains('two')").each(function(){
     if( $(this).text() == 'two' ) {
        $(this).attr("selected","selected");
     }
 });

Оператор if відповідає точному збігу з "two" і "two three" не буде збігатися

Найпростіший спосіб з 1.7+:

$("#myDropDown option:text=" + myText +"").attr("selected", "selected"); 

1.9+

$("#myDropDown option:text=" + myText +"").prop("selected", "selected"); 

Тестується і працює.

Ось дуже простий спосіб. PLZ використовувати його

$("#free").val("y").change();

погляньте на плагін jquery selectedbox

selectOptions(value[, clear]): 

Виберіть параметри за значенням, використовуючи рядок як параметр $("#myselect2").selectOptions("Value 1");або регулярний вираз $("#myselect2").selectOptions(/^val/i);.

Ви також можете очистити вже вибрані варіанти: $("#myselect2").selectOptions("Value 2", true);

Просто на сторонній записці. Моє вибране значення не було встановлено. І в мене був пошук по всій мережі. Насправді мені довелося вибрати значення після зворотного дзвінка з веб-служби, оскільки я отримував дані з нього.

$("#SelectMonth option[value=" + DataFromWebService + "]").attr('selected', 'selected'); 
$("#SelectMonth").selectmenu('refresh', true);

Тож оновлення селектора було єдиним, що мені не вистачало.

Я виявив, що за допомогою attrвас ви отримаєте кілька варіантів, вибраних тоді, коли цього не хочете - рішенням є використання prop:

$("#myDropDown option:text=" + myText +"").prop("selected", "selected");

У мене виникли проблеми із наведеними вище прикладами, і проблема була викликана тим, що значення мого вибору поля попередньо заповнюються рядками фіксованої довжини 6 символів, але параметр, який передається, не має фіксованої довжини.

У мене є функція rpad, яка праворуч накладати рядок, на вказану довжину та із зазначеним символом. Отже, після прокладки параметра він працює.

$('#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');
});

Ця прийнята відповідь не здається правильною, в той час як .val ('newValue') правильний для функції, спроба вилучити вибране ім'я не працює для мене, мені довелося використовувати id і ім'я класу, щоб отримати мій елемент

Ось простий варіант. Просто встановіть параметр списку, а потім встановіть його текст як вибране значення:

$("#ddlScheduleFrequency option").selected(text("Select One..."));

Дістаньте дітям вікно вибору; петля через них; знайшовши потрібного, встановіть його як обраний варіант; повернути помилкове, щоб перестати циклічно.