0

我有一个接收列表项的函数。当它这样做时，我想在列表项中文本的任一侧添加两个 div：例如，当它接收到该项目时：

<li class="sortedli">
  Call Type
</li>

它应该变成：

<li class="sortedli">
   <div class="sel-display-on">&nbsp;</div>
       Call Type
   <div class="sel-trash-on">&nbsp;</div>
</li>

但是，我的功能

receive: function (event, ui) {
   $(this).prepend("<div class=\"sel-display-on\"></div>");
   $(this).append("<div class=\"sel-trash-on\"></div>");
}

产生这个标记：

<div class="sel-display-on"></div>
<li class="sortedli" style="">Caller Id</li>
<div class="sel-trash-on"></div>

我该如何纠正这个问题？

4

2 回答 2

0

您正在附加/附加到.sortedli的父级。使用上下文找到正确的元素：

receive: function (event, ui) {
   $('.sortedli', this).prepend("<div class=\"sel-display-on\"></div>");
   $('.sortedli', this).append("<div class=\"sel-trash-on\"></div>");
}
于 2012-08-28T17:00:53.133 回答
0

尝试如下，

receive: function (event, ui) {
   $(this).html(function (idx, oldhtml) {
      return "<div class=\"sel-display-on\">&nbsp;</div>" + 
             oldhtml + 
             "<div class=\"sel-trash-on\">&nbsp;</div>";
}

你使用的是什么 jQuery UI 小部件。接收函数看起来像一个回调函数。所以 this 可能不是 li 元素。– 维加

@Vega - 显然不是，根据输出它是 li 的父母。– adeneo 44 秒前

如果上述方法不起作用，请尝试以下方法..

receive: function (event, ui) {
   $('.sortedli', this).html(function (idx, oldhtml) {
      return "<div class=\"sel-display-on\">&nbsp;</div>" + 
             oldhtml + 
             "<div class=\"sel-trash-on\">&nbsp;</div>";
}
于 2012-08-28T17:03:23.940 回答