I want do do this in jQuery:
<option value="test" selected>...</option>
But everything I've tried gives me:
<option value="test" selected="selected">...</option>
I have tried .attr("selected", "") as well as .attr("selected", true), but they give the undesired selected="selected" result. How can I do this? Everything I've found on online suggests either the former or the latter of the above formats.
You shouldn't worry about the attribute at all, you should be changing the property
$('option').prop('selected', true);
You can also set the selected option by just changing the value of the select (assuming it's not multiple)
$('select').val('test');
It doesn't matter what it looks like in the HTML, it's the representation in the DOM that matters, both for setting the option as selected and when submitting the form it's in.
FYI, <option value="test" selected="selected"> is not undesireable at all, it's completely valid and what you'd generally want.
When the selected attribute is present, the option is selected, regardless of the attributes value, even if it's empty the option will be selected.
Attributes should have values though, so selected="selected" is fine, and even something like selected="hello kitty" would select the option, to unselect it you'd remove the attribute, but again, you should be changing the property!!!
.attr work but not .prop?
attr. Secondly, as noted above, you should be changing the underlying property, not the attribute, but prop was added in jQuery 1.6, and hopefully you're using a newer version than that.