javascript - Div slide up when click in items inside it -

i have div slides down (opens) when click input select. inside div, have other input selects , objective slide div when click on rest of page.

my problem:

the div slides when select item in input selects inside it, , don't want happen.

• is there way slide div when click outside it?
• why selects inside div making slide well?

this javascript slide div:

$(document).mouseup(function (e) {   var container = $('.mydiv');   if (container.has(e.target).length === 0) {     $(container).removeclass('close');     $(container).addclass('open');     $(container).next().slideup(200);   } }); 

the div slides when select item in input selects inside it, , don't want happen.

is there way slide div when click outside it? why selects inside div making slide well?

use event.stoppropagation() on child element(s) prevent slide event being triggered them.

event.stoppropagation - prevents event bubbling dom tree, preventing parent handlers being notified of event.

here's simple jsfiddle , basic example below.

jquery:

$('div').click(function(){   $('#slidemeup').slideup(); });  $('select').click(function(e){   e.stoppropagation(); }); 

html:

<div>clicking here trigger it!      <select>         <option>this won't trigger click event anymore!</option>     </select>     clicking here trigger it! </div>  <div id="slidemeup">only clicking outer div slide me up!</div>