跳至主要内容

jquery change the select box value

we can do this at first:
$("#simple_search_bar .cat option[value=0]").prop('selected',true);
and there is an article talke about this:

The right way to do this depends upon your circumstances.

Case 1: No value attributes on the option elements

If your option elements don't have value attributes (and you're not worried about the possibility of somebody adding them later and inadvertently breaking your existing code), then just use the .val()method of the jQuery object wrapping your select element.
For instance, in the OP's case...
$select = $('#cbCategory');
$select.val(cat); // Selects the option with text `cat`, as long as the options don't have
                  // 'value' attributes.

Case 2: Option elements have value attributes

If your option elements have value attributes (or value attributes might be added in the future and you don't want your code to break), then there's no method built into jQuery to select options by text. In that case, use this function, or take what you need from the code:
/*
  Selects the 
function selectOptionByText(selectElement, targetText) {
    var $selectElement, $options, $targetOption;

    $selectElement = jQuery(selectElement);
    $options = $selectElement.find('option');
    $targetOption = $options.filter(
        function () {return jQuery(this).text() == targetText}
    );

    // We use `.prop` if it's available (which it should be for any jQuery versions above
    // and including 1.6), and fall back on `.attr` (which was used for changing DOM
    // properties in pre-1.6) otherwise.
    if (jQuery().prop) {
        $targetOption.prop('selected', true);
    } 
    else {
        $targetOption.attr('selected', 'true');
    }
}
Here we use filter to pick out only the option matching the targetText, and select it using either.attr or .prop, depending upon jQuery version (see .prop() vs .attr() for explanation).

How not to do this

There are a few approaches to selecting options by their text content that I've seen suggested on StackOverflow or elsewhere that you probably shouldn't follow, unless you have a really good reason and know what you're doing. Here they are, together with why they're bad ideas.

DON'T use .val() to select options by their text content if any of the options have valueattributes.

Using .val is suggested in the currently accepted answer to this question (at the moment that I'm writing), but on modern jQuery it only works if your option elements have no value attributes, as noted above. Using .val to select options by their text content when they had value attributes worked prior to jQuery version 1.4, but was considered a bug at that time and has since been fixed. (Here is the commit that made the change.)

DON'T give all your option elements value attributes equal to their text content and thenuse .val()

I've sometimes seen HTML where option elements in selects were all given value attributes equal to their text content. This is usually pointless; the value property of the option element will be equal to its text content if you don't specify a value attribute, and you can use .val on a jQuery selectelement to select options by text without giving them value attributes. If you don't need value attributes that are distinct from the text content of the option, it's simpler (and in some scenarios, like hand-written HTML, less error-prone) to not have value attributes at all, rather than duplicating content.

DON'T use the jQuery :contains selector instead of a .filter() call

:contains(someText) matches any elements of which someText is a substring, but here what we need is an exact text match. Even if :contains would be sufficient for a particular case (because nooption's text is a substring of another's in your particular select element), I would advise against using it. If you do so, you're needlessly writing code that is less explicit, harder to extract into a reusable function, and can break if you change your content.

DON'T use .attr() instead of .prop() for selecting options unless you absolutely need to in order to support pre-1.6 jQuery

评论

此博客中的热门博文

My childhood

"Each person's life is like a book; some people prefer to savor it slowly, while others like to gradually forget it. Looking back, I want to see if I can discern the trajectory of the world from my seemingly insignificant life. I am a child from the countryside, and perhaps most people cannot understand what my so-called countryside looks like. Indeed, the impressions of the countryside can be very different depending on the country, and moreover, more than 40 years have passed, during these 40 years of rapid development in China. A phrase suddenly comes to mind, 'I see him building tall buildings, I see him feasting, I see everything collapsing.' The place where I was born is a small town in the southwest of China, a town so small that it only has one street, and the widest part is only 3 meters. Paved with stone slabs, worn by many years of use, the slabs are not flat but rather filled with small bumps and hollows, yet strangely smooth. At the end of the street is a ...

youtube script covid

[INTRO - Soft Music Playing] Narrator: "In August 2020, during the COVID-19 pandemic in China, I experienced a series of events that revealed the overbearing, unreasonable, and ignorant aspects of government policies. This story unfolds my observations and experiences in Xinjiang since April, presented in a neutral and factual manner." [Scene Transition - Music Shifts to a More Reflective Tone] Narrator: "April 8th marked the end of my nearly three-month-long home quarantine in Wuhan, as the lockdown was finally lifted. With Xinjiang gradually reopening since March, my work required me to return there as soon as possible." [Visuals: Scenes of Empty Streets in Wuhan, Transitioning to Busy Airports] Narrator: "My journey back to Xinjiang was fraught with delays. The direct flight on China Southern Airlines kept getting postponed. Reluctantly, I had to transit through Xi'an. Before leaving, I reported my health status to the community in Changji City, where I ...

关于 6月16日香港大游行 统计

wikipedia: https://zh.wikipedia.org/wiki/2019年6月16日香港反對逃犯條例修訂草案遊行  主办单位公布游行有200万零1人参与,是香港史上主办方公布最多人参加的游行;而警方宣称游行人数仅有33.8万人[e],警方计算游行人数的方法惹来外媒如路透社[9]、BBC[21]、天下杂志等广泛不信任[22][23]。由于本游行仓促成行,不像6月9日与7月1日的游行有人工智能客观统计,加上这次大游行中人流不断溢出多条原定游行路线以外的街道,令统计人数工作更困难,本游行双方差距甚大的人数统计令到人工智能取代传统点算之议方兴未艾。[5][24]无论如何,此游行的人数是1997年回归以来人数最多则无疑问。众多第三方统计之中,路透社与一众日本传媒仅引用了在现场调试[5]人工智能系统的叶兆辉所提供的估算“50-80万人”. yahoo news: https://yahoo-news.com.hk/BBCChineseNews/4174/ 政府公布的數字往往會比遊行主辦方公布的數字低,偏差有時候會達數倍,一高一低的有關數字常引發爭議。例如,早些時候香港民間人權陣線(簡稱「民陣」)為反對《逃犯條例》修訂舉行數次遊行,對於6月16日舉行的遊行,主辦方「民陣」稱有約200萬人參加,香港警方卻說高峰期只有約33.8萬人。 此文还有历次游行主办方和警方的数据统计比较 Voa: https://www.voachinese.com/a/Hong-Kong-demonstration-numbers-20190709/4992522.html 香港游行人数之差,在近年来日益明显而引人关注。就在这次“两百万”人大游行之前一周,香港人举行了首次“反送中”大游行,游行人数之多,几乎占满了港岛几条主要干线。主办方说超过1百万人上街游行,警方说有24万。双方数字相差四分之三。值得关注的是,每次超大型游行后,总有示威者和警方发生冲突的报道,每次都有人受伤或被捕。 无论如此,从双方数字上来看,2019年6月爆发的两次大游行,(9日和16日),是香港主权移交以来也是香港有史以来最大规模的示威。 上次香港市民举行大规模游行示威,是2003年的反23条大游行。据主办方说那次游行参加人数为50万,警方说只有35万,双方当时的统计数...