【问题标题】:jQuery insertAfter not workingjQuery insertAfter 不工作
【发布时间】:2014-06-03 02:02:31
【问题描述】:

我有一组按钮:

  <div id="button">
      <button id="show_link_group">Show Links</button>
      <button id="show_contact_group">Show Contacts</button>
      <button id="show_update_group">Show Updates</button>
      <button id="show_activity_group">Show Action Items</button>
  </div>

我正在尝试在它之后插入我的这个 div:

<div id="link_group">

      <p1>adsfadsf</p1>
</div>

它应该在我单击 id="show_link_group" 的按钮后插入:

$('#show_link_group').click(function() {
  $("<div id='link_group'").after('<div id="button"></div>');
});

当我点击它时,它什么也没做。我遵循了这个文档:

http://api.jquery.com/insertafter/

我做错了什么??

谢谢!

【问题讨论】:

  • 您的选择器错误,您使用的是after 方法而不是insertAfter

标签: jquery insertafter


【解决方案1】:

您必须使用选择器来指定插入位置,而不是 HTML 字符串。

$("<div id='link_group'><p1>asdfasdf</p1></div>").insertAfter("#button");

如果link_group DIV 已经在 DOM 中,你可以这样做:

$("#link_group").insertAfter("#button");

这会将其从当前位置移动到按钮之后。

【讨论】:

  • 我们有p1 元素吗?
  • 不,但 OP 显然不在乎,这就是他想要插入的内容。
  • @barmar - 我的 link_group 中没有 p1 元素。我的 link_group 有一堆表格、段落和列表。我想在我的#button 下插入我的link_group 中的所有内容。请指教。
  • 您的问题中有&lt;p1&gt;
  • 所以用实际应该存在的任何内容替换该占位符。
【解决方案2】:

你有向后的 .after() 方法。你需要先告诉它,“我想在什么元素之后插入它。”然后告诉它要在该元素之后插入的内容。

你有这个:

$('#show_link_group').click(function() {
  $("<div id='link_group'").after('<div id="button"></div>');
});

你想要这个:

var content = "my content";
$('#show_link_group').click(function() {
   $("#button").after(content);
});

这是一个带有您的解决方案的 jsbin。 http://jsbin.com/qaxan/1/edit

【讨论】:

  • 问题是关于insertAfter,而不是after。他的代码用错了。
  • 你是对的。我使用了 .after() ,因为那是用户代码中的内容。根据 insertAfter() 文档,它们都执行相同的任务,“主要区别在于语法,特别是内容和目标的放置。”我添加的 jsbin 显示两者都在使用中。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2019-07-13
  • 1970-01-01
  • 2019-11-06
  • 2011-07-17
  • 2012-07-31
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多