函數顯示值停止工作，當我添加此stopPropagation函數

Question

我正在造型一些MultiSelect元素與無序（）HTML列表，但當我添加最近的函數（關閉另一個元素被點擊時的容器）另一個功能停止工作 - 顯示覆選框值的選項。

與完整代碼小提琴是在這裏：http://jsfiddle.net/chayacooper/ezxSF/19/

的功能我加入

// Close the container when click elsewhere on the page 
$('html').click(function() { $('#select_colors').hide(); }); 
$('.dropdown_box_colors, .dropdown_container_colors').click(function (e) { 
    e.stopPropagation(); 
    return false; 
}); 

原有功能

$(document).ready(function() { 
    // Opens the container and close it on mouseleave 
    $(".dropdown_box_colors").click(function() { 
     $("#select_colors").show(); 
    });   
    var timeoutID; 
    $("#select_colors").mouseleave(function() { 
      timeoutID = setTimeout(function() { 
     $("#select_colors").hide(); 
     }, 800); 
    }); 
    $("#select_colors").mouseenter(function() { 
     clearTimeout(timeoutID); 
    }); 
    // Displays the values of checkboxes checked in a container (adds/removes them when they're checked/unchecked). Displays the # selected if more than 3 items are checked 
    $(".dropdown_container_colors input").change(function() { 
     var checked = $(".dropdown_container_colors input:checked"); 
     var span = $(".dropdown_box_colors span"); 
     if (checked.length > 3) { 
      span.html("" + checked.length + " selected"); 
     } else {    
      span.html(checked.map(function(){ 
       return $(this).closest('label').clone().children().remove().end().text(); 
      }).get().join(", ")); 
     } 
    }); 
}); 
// Toggles the visibility of the checkmark 
function toggle_colorbox_alt(span) { 
    div = span.getElementsByTagName('div')[0]; 
    cb = span.getElementsByTagName('input')[0]; 
    if (cb.checked == false) { 
     div.style.visibility = "visible"; 
     span.className = "colorSwatch colorSwatchSelected"; 
     cb.checked = true; 
    } 
    else { 
     div.style.visibility = "hidden"; 
     span.className = "colorSwatch"; 
     cb.checked = false; 
    } 
} 

HTML

<div class="dropdown_box_colors"><span>Select</span></div> 
<div class="dropdown_container_colors"> 
    <ul id="select_colors"> 
     <li> 
      <a href="#"><label onclick="toggle_colorbox_alt(this.children[0]);"> 
      <div style="background-color: #000000" class="colorSwatch"> 
       <div class=CheckMark>&#10003;</div> 
       <input type="checkbox" name="color[]" value="Black" class="ckBox"/> 
      </div>Black</label></a> 
     </li> 
     <!-- Additional List Items --> 
    </ul> 
</div> 

Answer 1

Try removing return false from onclick event handler after calling stopPropagation(). 

Have a look at the working fiddle here: http://jsfiddle.net/ezxSF/22/