在div上添加关闭按钮

Question

第一次单击按钮后，如何在灰盒顶部添加关闭按钮？单击文件夹，打开按钮后，灰色区域出现，我想添加一个按钮图标{primary: "ui-icon-close"}，从jQuery UI的http://www.petefreitag.com/cheatsheets/jqueryui-icons/

点击这个X按钮后，我想$("#1").html(<div class="normal"><div>);所以盒子返绿再次。

这是我小提琴 http://jsfiddle.net/3HauW/205/

Answer 1

有一种更好的方式做你想做的，但这里是工作示例的现有这样做的方式。

http://jsfiddle.net/3HauW/217/

变化，我提出：

var newHtml ='<div class="button_wrap ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only" role="button" aria-disabled="false" title=""><span class="ui-button-icon-primary ui-icon ui-icon-close"></span><span class="ui-button-text"></span></div>'; 
    newHtml +="Blah Blah Blah"; 

这里......

$(function(){ 
    $('#1 .button_wrap').on('click', function(e){ 
     e.stopPropagation(); 
     $(".info").html(newHtml).show(); 

});}); 

，并将此

$(function(){ 
    $("#1").on("click", ".info .ui-icon-close", function(){ 
     $(".info").hide(); 
    }); 
}); 

而这款以CSS

.info{ 
    top: 0; 
    width: 12.5em; 
    background-color:#cfcfcf; 
    overflow-y: auto; 
    display:block; 
    height:200px; 
    z-index:19; 
    color:black; 
    word-wrap:break-word; 
    position: absolute; 
    display: none; 
}