Question

我有一些js将prev / next链接附加到页面上的一堆标签：

  $("fieldset.vertical-tabs-pane:not(':first')").append("<a href='#' class='previous-tab' title='Go back to previous step'>< Back</a>");
    $("fieldset.vertical-tabs-pane:not(':last')").append("<a href ='#' class='next-tab' title='Continue to next step'>Next ></a>");

我想将两个链接放在一个div中，以便最终的代码可以读取：

<div class="navigation">
  <a href>previous</a>
  <a href>next</a>
</div>

我很难过 - 我不能只在第一个<div>添加</div>标签，在最后一个{{1}}添加{1}}标签，因为在第一个标签页上没有显示“返回”的智能“最后意味着他们并不总是在那里。我尝试使用.after（）来封闭两行js，它们写了一个div的开始和结束，但它在链接之后写了整个div，而不是在它们周围。

我确信必须有一个简单的解决方案，但我无法理解！非常感谢任何帮助。

Answer 1

您可以尝试.append()代表最后一个，.prepend()代表第一个。

Answer 2

这是否符合您的需要？

$("fieldset.vertical-tabs-pane").append('<div class="navigation"></div>');
$("fieldset.vertical-tabs-pane:not(':first') div.navigation").append("<a href='#' class='previous-tab' title='Go back to previous step'>< Back</a>");
$("fieldset.vertical-tabs-pane:not(':last') div.navigation").append("<a href ='#' class='next-tab' title='Continue to next step'>Next ></a>");

Answer 3

试试这个：

var nav = $('<div>', {
   id: 'navigation',
   html: "<a href='#' class='previous-tab' title='Go back to previous step'>< Back</a>\n\
<a href ='#' class='next-tab' title='Continue to next step'>Next ></a>"
});

nav.appendTo($('somewhere'));

这是创建的html：

<div id="navigation">
    <a href="#" class="previous-tab" title="Go back to previous step">&lt; Back</a>
    <a href="#" class="next-tab" title="Continue to next step">Next &gt;</a>
</div>

这是一个小提琴演示：http://jsfiddle.net/maniator/pb8d5/

Answer 4

这样做（创建链接后）：

$("a.previous-tab, a.next-tab").wrapAll('<div class="navigation"/>');

希望这会有所帮助。干杯

js：如何将这些append（）s一起包含在div中？

4 个答案: