Select change on HTML Click() in IE7,8,9?

I have the following html

<div id="active-el">
    <select id开发者_如何转开发="select-drop">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <div>test test test</div>
</div>

with said jQuery

var active = true;

jQuery('#active-el').live('mouseenter', function () {
    active = true;
    console.log('over active = true');
});

jQuery("html").click(function () {
    if (!active) {
     alert('not selected');   
    }
});

You can see it working here http://jsfiddle.net/hLDxM/2/. I have a problem that when I change the select dropdown - it becomes not active ?

How can I ensure that even if the user changes the select to any value - that the (html).click event wont' fire ? That is - regardless of option 1,2,3 or - it's still within the #active-el and therefore should be active?

Im not sure what you are trying to do but try just change

    var active = true;

jQuery('#active-el').live('mouseover', function () {
    active = true;
    console.log('over active = true');
}).live('mouseout', function () {
    active = false;
    console.log('over not active = false');
});

jQuery("html").click(function () {
    if (!active) {
     alert('not selected');   
    }
});

to mouseout and mouseover instead of mouseenter and mouseleave.

Could you describe what you want to acomplish?

Update: used .change() in the end to resolve this.

Noted that - .live(change,function() {}); doesn't work in jQuery 1.6.2