jquery remove()没有删除div

时间:2015-03-04 21:58:27

标签: jquery jquery-ui

我有jquery选项卡,当我点击小x关闭它时,调用我的委托并删除标签部分,但标签内容不是。在开发工具中,我仍然在dom中看到它。我似乎也没有收到任何错误。只是想知道是否有人知道为什么?请注意,我在标签内容中使用了ace编辑器,但我认为这不重要。

在我删除dom之前看起来像:

<div id="tabs" style="padding: 0; margin: 0; height: 100%" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
    <ul id="tabFiles" class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all ui-sortable" role="tablist">
        <li id="App.lua.tab" class="ui-state-default ui-corner-top ui-tabs-active ui-state-active ui-sortable-handle" role="tab" tabindex="0" aria-controls="App.lua.content" aria-labelledby="ui-id-1" aria-selected="true" aria-expanded="true">
            <a href="#App.lua.content" class="ui-tabs-anchor" role="presentation" tabindex="-1" id="ui-id-1">App.lua</a>
            <span class="ui-icon ui-icon-close" role="presentation">Remove Tab</span>
        </li>
    </ul>
    <div id="App.lua.content" style="padding: 0px; margin-left: 0px; display: block;" aria-labelledby="ui-id-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom" role="tabpanel" aria-hidden="false">
        <div id="App.lua.editor" class="editor ace_editor ace-chrome">
            <textarea class="ace_text-input" wrap="off" autocorrect="off" autocapitalize="off" spellcheck="false" style="opacity: 0; height: 14px; width: 6.5978125px; left: 51px; top: 0px;"></textarea>
            <div class="ace_gutter"><div class="ace_layer ace_gutter-layer ace_folding-enabled" style="margin-top: 0px; height: 626px; width: 47px;">
                <div class="ace_gutter-cell " style="height: 14px;">1</div>
            <div class="ace_gutter-cell " style="height: 14px;">2<span class="ace_fold-widget ace_start ace_open" style="height: 14px;"></span>
            </div>
            <div class="ace_gutter-cell " style="height: 14px;">3</div>
            <div class="ace_gutter-cell " style="height: 14px;">4</div><div class="ace_gutter-cell " style="height: 14px;">5</div><div class="ace_gutter-cell " style="height: 14px;">6</div><div class="ace_gutter-cell " style="height: 14px;">7</div><div class="ace_gutter-cell " style="height: 14px;">8</div><div class="ace_gutter-cell " style="height: 14px;">9</div><div class="ace_gutter-cell " style="height: 14px;">10</div><div class="ace_gutter-cell " style="height: 14px;">11</div><div class="ace_gutter-cell " style="height: 14px;">12</div><div class="ace_gutter-cell " style="height: 14px;">13</div><div class="ace_gutter-cell " style="height: 14px;">14</div><div class="ace_gutter-cell " style="height: 14px;">15</div><div class="ace_gutter-cell " style="height: 14px;">16</div><div class="ace_gutter-cell " style="height: 14px;">17</div><div class="ace_gutter-cell " style="height: 14px;">18</div><div class="ace_gutter-cell " style="height: 14px;">19</div><div class="ace_gutter-cell " style="height: 14px;">20</div><div class="ace_gutter-cell " style="height: 14px;">21</div><div class="ace_gutter-cell " style="height: 14px;">22</div><div class="ace_gutter-cell " style="height: 14px;">23</div><div class="ace_gutter-cell " style="height: 14px;">24</div><div class="ace_gutter-cell " style="height: 14px;">25</div><div class="ace_gutter-cell " style="height: 14px;">26</div><div class="ace_gutter-cell " style="height: 14px;">27</div><div class="ace_gutter-cell " style="height: 14px;">28</div><div class="ace_gutter-cell " style="height: 14px;">29</div><div class="ace_gutter-cell " style="height: 14px;">30</div><div class="ace_gutter-cell " style="height: 14px;">31</div><div class="ace_gutter-cell " style="height: 14px;">32<span class="ace_fold-widget ace_start ace_open" style="height: 14px;"></span></div><div class="ace_gutter-cell " style="height: 14px;">33</div><div class="ace_gutter-cell " style="height: 14px;">34</div><div class="ace_gutter-cell " style="height: 14px;">35</div><div class="ace_gutter-cell " style="height: 14px;">36</div><div class="ace_gutter-cell " style="height: 14px;">37</div><div class="ace_gutter-cell " style="height: 14px;">38<span class="ace_fold-widget ace_start ace_open" style="height: 14px;"></span></div><div class="ace_gutter-cell " style="height: 14px;">39</div><div class="ace_gutter-cell " style="height: 14px;">40</div><div class="ace_gutter-cell " style="height: 14px;">41</div><div class="ace_gutter-cell " style="height: 14px;">42</div><div class="ace_gutter-cell " style="height: 14px;">43</div><div class="ace_gutter-cell " style="height: 14px;">44</div></div><div class="ace_gutter-active-line" style="top: 0px; height: 14px;"></div></div><div class="ace_scroller" style="left: 47px; right: 17px; bottom: 0px;"><div class="ace_content" style="margin-top: 0px; width: 956px; height: 626px; margin-left: 0px;"><div class="ace_layer ace_print-margin-layer"><div class="ace_print-margin" style="left: 531.825px; visibility: visible;"></div></div><div class="ace_layer ace_marker-layer"><div class="ace_active-line" style="height:14px;top:0px;left:0;right:0;"></div></div><div class="ace_layer ace_text-layer" style="padding: 0px 4px;"><div class="ace_line" style="height:14px"><span class="ace_comment">--This&nbsp;function&nbsp;will&nbsp;be&nbsp;called&nbsp;once&nbsp;when&nbsp;the&nbsp;program&nbsp;starts</span></div><div class="ace_line" style="height:14px"><span class="ace_keyword">function</span>&nbsp;<span class="ace_identifier">App</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Start</span><span class="ace_paren ace_lparen">(</span><span class="ace_paren ace_rparen">)</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--Initialize&nbsp;Steamworks&nbsp;(optional)</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_identifier">Steamworks</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Initialize</span><span class="ace_paren ace_lparen">(</span><span class="ace_paren ace_rparen">)</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--Set&nbsp;the&nbsp;application&nbsp;title</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">title</span><span class="ace_keyword ace_operator">=</span><span class="ace_string">"MyGame"</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--Create&nbsp;a&nbsp;window</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_keyword">local</span>&nbsp;<span class="ace_identifier">windowstyle</span>&nbsp;<span class="ace_keyword ace_operator">=</span>&nbsp;<span class="ace_identifier">Window</span>.<span class="ace_identifier">Titlebar</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_keyword">if</span>&nbsp;<span class="ace_identifier">System</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">GetProperty</span><span class="ace_paren ace_lparen">(</span><span class="ace_string">"fullscreen"</span><span class="ace_paren ace_rparen">)</span><span class="ace_keyword ace_operator">==</span><span class="ace_string">"1"</span>&nbsp;<span class="ace_keyword">then</span>&nbsp;<span class="ace_identifier">windowstyle</span><span class="ace_keyword ace_operator">=</span><span class="ace_identifier">windowstyle</span><span class="ace_keyword ace_operator">+</span><span class="ace_identifier">Window</span>.<span class="ace_identifier">FullScreen</span>&nbsp;<span class="ace_keyword">end</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">window</span><span class="ace_keyword ace_operator">=</span><span class="ace_identifier">Window</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Create</span><span class="ace_paren ace_lparen">(</span><span class="ace_variable ace_language">self</span>.<span class="ace_identifier">title</span>,<span class="ace_constant ace_numeric">0</span>,<span class="ace_constant ace_numeric">0</span>,<span class="ace_identifier">System</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">GetProperty</span><span class="ace_paren ace_lparen">(</span><span class="ace_string">"screenwidth"</span>,<span class="ace_string">"1024"</span><span class="ace_paren ace_rparen">)</span>,<span class="ace_identifier">System</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">GetProperty</span><span class="ace_paren ace_lparen">(</span><span class="ace_string">"screenheight"</span>,<span class="ace_string">"768"</span><span class="ace_paren ace_rparen">)</span>,<span class="ace_identifier">windowstyle</span><span class="ace_paren ace_rparen">)</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">window</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">HideMouse</span><span class="ace_paren ace_lparen">(</span><span class="ace_paren ace_rparen">)</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--Create&nbsp;the&nbsp;graphics&nbsp;context</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">context</span><span class="ace_keyword ace_operator">=</span><span class="ace_identifier">Context</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Create</span><span class="ace_paren ace_lparen">(</span><span class="ace_variable ace_language">self</span>.<span class="ace_identifier">window</span>,<span class="ace_constant ace_numeric">0</span><span class="ace_paren ace_rparen">)</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_keyword">if</span>&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">context</span><span class="ace_keyword ace_operator">==</span><span class="ace_constant ace_language">nil</span>&nbsp;<span class="ace_keyword">then</span>&nbsp;<span class="ace_keyword">return</span>&nbsp;<span class="ace_constant ace_language">false</span>&nbsp;<span class="ace_keyword">end</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--Create&nbsp;a&nbsp;world</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">world</span><span class="ace_keyword ace_operator">=</span><span class="ace_identifier">World</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Create</span><span class="ace_paren ace_lparen">(</span><span class="ace_paren ace_rparen">)</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">world</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">SetLightQuality</span><span class="ace_paren ace_lparen">((</span><span class="ace_identifier">System</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">GetProperty</span><span class="ace_paren ace_lparen">(</span><span class="ace_string">"lightquality"</span>,<span class="ace_string">"1"</span><span class="ace_paren ace_rparen">)))</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--Load&nbsp;a&nbsp;map</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_keyword">local</span>&nbsp;<span class="ace_identifier">mapfile</span>&nbsp;<span class="ace_keyword ace_operator">=</span>&nbsp;<span class="ace_identifier">System</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">GetProperty</span><span class="ace_paren ace_lparen">(</span><span class="ace_string">"map"</span>,<span class="ace_string">"Maps/start.map"</span><span class="ace_paren ace_rparen">)</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_keyword">if</span>&nbsp;<span class="ace_identifier">Map</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Load</span><span class="ace_paren ace_lparen">(</span><span class="ace_identifier">mapfile</span><span class="ace_paren ace_rparen">)</span><span class="ace_keyword ace_operator">==</span><span class="ace_constant ace_language">false</span>&nbsp;<span class="ace_keyword">then</span>&nbsp;<span class="ace_keyword">return</span>&nbsp;<span class="ace_constant ace_language">false</span>&nbsp;<span class="ace_keyword">end</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_keyword">return</span>&nbsp;<span class="ace_constant ace_language">true</span></div><div class="ace_line" style="height:14px"><span class="ace_keyword">end</span></div><div class="ace_line" style="height:14px"></div><div class="ace_line" style="height:14px"><span class="ace_comment">--This&nbsp;is&nbsp;our&nbsp;main&nbsp;program&nbsp;loop&nbsp;and&nbsp;will&nbsp;be&nbsp;called&nbsp;continuously&nbsp;until&nbsp;the&nbsp;program&nbsp;ends</span></div><div class="ace_line" style="height:14px"><span class="ace_keyword">function</span>&nbsp;<span class="ace_identifier">App</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Loop</span><span class="ace_paren ace_lparen">(</span><span class="ace_paren ace_rparen">)</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--If&nbsp;window&nbsp;has&nbsp;been&nbsp;closed,&nbsp;end&nbsp;the&nbsp;program</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_keyword">if</span>&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">window</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Closed</span><span class="ace_paren ace_lparen">(</span><span class="ace_paren ace_rparen">)</span>&nbsp;<span class="ace_keyword">or</span>&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">window</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">KeyDown</span><span class="ace_paren ace_lparen">(</span><span class="ace_identifier">Key</span>.<span class="ace_identifier">Escape</span><span class="ace_paren ace_rparen">)</span>&nbsp;<span class="ace_keyword">then</span>&nbsp;<span class="ace_keyword">return</span>&nbsp;<span class="ace_constant ace_language">false</span>&nbsp;<span class="ace_keyword">end</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--Handle&nbsp;map&nbsp;change</span></div><div class="ace_line" style="height:14px">&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_keyword">if</span>&nbsp;<span class="ace_identifier">changemapname</span><span class="ace_keyword ace_operator">~=</span><span class="ace_constant ace_language">nil</span>&nbsp;<span class="ace_keyword">then</span></div><div class="ace_line" style="height:14px"><span class="ace_indent-guide">&nbsp;&nbsp;&nbsp;&nbsp;</span>&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px"><span class="ace_indent-guide">&nbsp;&nbsp;&nbsp;&nbsp;</span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--Clear&nbsp;all&nbsp;entities</span></div><div class="ace_line" style="height:14px"><span class="ace_indent-guide">&nbsp;&nbsp;&nbsp;&nbsp;</span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_variable ace_language">self</span>.<span class="ace_identifier">world</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Clear</span><span class="ace_paren ace_lparen">(</span><span class="ace_paren ace_rparen">)</span></div><div class="ace_line" style="height:14px"><span class="ace_indent-guide">&nbsp;&nbsp;&nbsp;&nbsp;</span>&nbsp;&nbsp;&nbsp;&nbsp;</div><div class="ace_line" style="height:14px"><span class="ace_indent-guide">&nbsp;&nbsp;&nbsp;&nbsp;</span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_comment">--Load&nbsp;the&nbsp;next&nbsp;map</span></div><div class="ace_line" style="height:14px"><span class="ace_indent-guide">&nbsp;&nbsp;&nbsp;&nbsp;</span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="ace_identifier">Time</span><span class="ace_keyword ace_operator">:</span><span class="ace_identifier">Pause</span><span class="ace_paren ace_lparen">(</span><span class="ace_paren ace_rparen">)</span></div></div><div class="ace_layer ace_marker-layer"></div><div class="ace_layer ace_cursor-layer ace_hidden-cursors"><div class="ace_cursor" style="left: 4px; top: 0px; width: 6.5978125px; height: 14px;"></div></div></div></div><div class="ace_scrollbar ace_scrollbar-v" style="width: 22px; bottom: 0px;"><div class="ace_scrollbar-inner" style="width: 22px; height: 1162px;"></div></div><div class="ace_scrollbar ace_scrollbar-h" style="display: none; height: 22px; left: 47px; right: 17px;"><div class="ace_scrollbar-inner" style="height: 22px; width: 956px;"></div></div><div style="height: auto; width: auto; top: 0px; left: 0px; visibility: hidden; position: absolute; white-space: pre; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; overflow: hidden;"><div style="height: auto; width: auto; top: 0px; left: 0px; visibility: hidden; position: absolute; white-space: pre; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; overflow: visible;"></div>
            <div style="height: auto; width: auto; top: 0px; left: 0px; visibility: hidden; position: absolute; white-space: pre; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; overflow: visible;">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</div></div>
        </div>  
    </div>
</div>

App.lua.editor div中显然有很多东西,但是这些都是由ace编辑器库提供的​​。

这是我用来删除标签及其内容

的内容
var tabs = $("#tabs").tabs();
        tabs.delegate( "span.ui-icon-close", "click", function() {
            if(confirm("Are you sure you want to close?") == false){
                return;
            }

            var panelId = $( this ).closest( "li" ).remove().attr( "aria-controls" );

            alert(panelId);
            $("#" + panelId).remove();
            tabs.tabs("refresh");
        });

如前所述,标签li确实已被删除,但App.lua.content div仍保留在DOM中,即使panelID为&#34; App.lua.content&#34;在警报中。我假设什么都不能阻止从DOM中删除元素?

1 个答案:

答案 0 :(得分:2)

这是因为ID包含.,因此选择器会选择ID为App但具有luacontent类的元素。尝试逃避点:

$("#" + panelId.replace(/\./g, '\\.')).remove();