Find default selected option in HTML select tag?

Question

I found code online to clear a form but it had nothing for a select box. With jquery i tried adding code to select the default option in the select box when i reset the form. I figured the only way to find the default was to look for where the SELECTED option was. I then discovered when the user selects something else jquery does not see selected as the default but as to the new option the user selected.

How do i get find the default option in the form so i can clear this properly?

//http://www.learningjquery.com/2007/08/clearing-form-data
$.fn.clearForm = function () {
    return this.each(function () {
        var type = this.type, tag = this.tagName.toLowerCase();
        if (tag == 'form')
            return $(':input', this).clearForm();
        if (type == 'text' || type == 'password' || tag == 'textarea')
            this.value = '';
        else if (type == 'checkbox' || type == 'radio')
            this.checked = false;
        else if (tag == 'select') {
            //alert($('option', this).size());
            alert($('option[selected]', this).val());
        }
    });
};

Answer 1

Usually the default is the first <option> in the <select>, so you can do that:

$(this).find("option:first").attr("selected", true);

Though, if you're resetting an entire form, you can reset it to what it was on page load with a .reset() call, like this:

if (tag == 'form')
  this.reset();

I'm not sure that's what you're really after, but just throwing it out there. Often the native DOM methods already there are very handy, don't ignore them!