Given the HTML below, I need a jQuery selector that selects the <option>
with the with-stamp
class.
<select name="preset_select">
<option selected="selected" value="original">ORIGINAL</option>
<option value="large">LARGE</option>
<option class="with-stamp" value="medium">MEDIUM</option>
</select>
$("select[name=preset_select]").change(function() {
// console.log( $(this).hasClass("with-stamp") ); // all false
// console.log( $("select[name=preset_select] option").hasClass("with-stamp") ); // all true
});
Syntax of jQuery Select Option$(“selector option: selected”); The jQuery select option is used to display selected content in the option tag. text syntax is below: var variableValue = $(“selector option: selected”).
jQuery selectors allow you to select and manipulate HTML element(s). jQuery selectors are used to "find" (or select) HTML elements based on their name, id, classes, types, attributes, values of attributes and much more.
Projects In JavaScript & JQueryjQuery uses CSS selector to select elements using CSS. Let us see an example to return a style property on the first matched element. The css( name ) method returns a style property on the first matched element.
$("select[name='preset_select']").change(function() {
$(this).children(':selected').hasClass('with-timestamp')
}
You need to check only the :selected
<option>
(since .hasClass()
returns true
if any of the elements in the set have the class), like this:
$("select[name=preset_select] option:selected").hasClass("with-stamp")
$("select[name=preset_select] option:selected").hasClass('with-stamp').change(function() {
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With