6

The following:

  $("select option:contains(fish)").attr('selected', true);

Works wonderfully in anything below jQuery 1.9, but does not work at all in jQuery 1.9+. I have been searching for any documentation on any change, but have not found anything.

Any idea how to get this code to work with the new jquery?

Example Here (defaults to jQuery 1.4): http://jsfiddle.net/reigel/TZmEw/

Ray Suelzer
  • 4,026
  • 5
  • 39
  • 55

5 Answers5

17

Use Prop api instead of attr for jquery 1.9.

$("select option:contains(fish)").prop('selected', 'selected');

OR

 $("select option:contains(fish)").prop('selected', true);

Reason : jQuery 1.6 introduced the .prop() method for setting or getting properties on nodes and deprecated the use of .attr() to set properties. However, versions up to 1.9 continued to support using .attr() for specific situations. This behavior in the name of backwards compatibility causes confusion when selectors are used that distinguish between attributes and properties.

Source : http://jquery.com/upgrade-guide/1.9/#changes-of-note-in-jquery-1-9

Mentioned in Attr Api : As of jQuery 1.6, the .attr() method returns undefined for attributes that have not been set. In addition, .attr() should not be used on plain objects, arrays, the window, or the document. To retrieve and change DOM properties, use the .prop() method.

Source : http://api.jquery.com/attr/#entry-longdesc

insomiac
  • 5,648
  • 8
  • 45
  • 73
  • http://api.jquery.com/attr/ The jQuery documentation says nothing about attr being deprecated in favor of prop. – Eric Jan 16 '13 at 19:37
  • 1
    Just to clarify, the `.attr()` API is not deprecated. Using the `.attr()` API improperly is deprecated, and has been since jQuery 1.6. As of version 1.9, jQuery no longer tries to convert `.attr()` into `.prop()` automatically because it confuses things even worse -- for example when selecting elements. To change the dynamic value of a form element, use `.prop()`. – Dave Methvin May 24 '13 at 19:46
1
$("select option:contains(fish)").attr('selected', 'selected');
Eric
  • 907
  • 7
  • 13
1

Please see the jQuery documentation on the topic with respect to 1.9 specifically. .attr vs. .prop can be confusing since that I know of there is no specific way to know what "properties" are. For all intents and purposes, when changing values that the user has the ability to change .. especially boolean values, you should use .prop

One exception is an input's value -- you should use .val for that. Similarly, it's probably better to use .val to set the <select> elements value -- not easy to do in your case, but it would be more accurate.

jQuery 1.6 introduced the .prop() method for setting or getting properties on nodes and deprecated the use of .attr() to set properties. However, versions up to 1.9 continued to support using .attr() for specific situations.

Explosion Pills
  • 188,624
  • 52
  • 326
  • 405
1

Try this 

$("select option").removeAttr('selected').filter(":contains(fish)").attr('selected', true);
Varinder Singh
  • 1,570
  • 1
  • 11
  • 25
0

Since jQuery 1.6, you should be using prop:

$("select option:contains(fish)").prop('selected', true);

In jQuery 1.6.1, they re-introduced this functionality to the attr method, for backwards compatibility (people were complaining). In 1.9 they removed it again, since this functionality has been deprecated long enough.

Joseph Silber
  • 214,931
  • 59
  • 362
  • 292