1

我正在尝试使用 jquery empty 删除特定 div 的内容,这些内容基本上是列表项和标题,以便我可以用新内容替换。当我运行代码时会发生什么,整个 div 元素闪烁并闪烁替换的内容,然后旧的重新出现。谁能告诉我我做错了什么?这是我的代码的摘录-

$("#msg_tab").bind("click",function(){
  $("#sidebar1").remove(); 
  var html=".....";
  $("#sidebar1").append(html);
 });



<div id="sidebar1" class="sidebar">
   <ul>
    <li>
     <h2>Messages</h2>
     <ul>
      <li><a href="#">Compose New Message</a></li>
      <li><a href="#">Inbox</a></li>
      <li><a href="#">Outbox</a></li>      
      <li><a href="#">Unread</a></li>
      <li><a href="#">Archive</a></li>
     </ul>
    </li>
   </ul>
  </div>

另一个问题是,如何在 javascript 中编写多行 html 代码字符串,以便 java 将其识别为字符串值?当字符串不是 html 代码时,在末尾放置正斜杠是可以的,但是在 html 代码中,我无法弄清楚如何从结束标签中转义正斜杠。我尝试用反斜杠转义它,但没有工作。如果有人也能阐明这个问题,我将不胜感激。

4

3 回答 3

6

您使用了错误的功能。你想要empty()

$("#sidebar1").empty();

remove()将完全删除该元素。

或者,您可以使用html()替换所有内容。

但是,您的关键问题是您不会停止事件传播。你的链接是:

<a id="msg_tab" href="" class="tab msgtab">MESSAGES</a>

绝不href意味着如果您单击此类链接,您将导航回同一页面。您的事件处理程序应该是:

$("#msg_tab").bind("click",function(){
  var html=".....";
  $("#sidebar1").html(html);
  return false;
});

return false停止事件传播,当前正在强制刷新页面。这就是您没有看到更新的原因。

于 2010-03-09T03:37:37.513 回答
3

您正在向指向当前页面的超链接添加点击处理程序。
单击处理程序执行后,超链接被单击并重新加载页面,将其重置为原始状态。

您需要添加return false;到您的click处理程序以防止页面重新加载。
或者,您可以将 href 属性更改为href="#".

于 2010-03-09T04:17:08.603 回答
0

你也可以使用

$("#sidebar1").html("");

清空任何特定 div 的内容...

于 2010-03-09T03:50:00.703 回答