jQuery .append (), prepend (), after () ... дублировать элементы и содержимое?

Question

В моем коде эта команда запускается только один раз:

jQuery("#commentrating").append('A');

но внутри div #commentrating появляются два элемента "A"! Что может быть причиной этой ошибки?

P.S. .after() также глючит: S

Answer 1

Две возможные причины:

(при использовании append, appendTo, prepend, prependTo ...):

---

1) Если вы присоединяете 2 источника элементов к 1 месту назначения элемента, если вы используете:

$("destination").append("source");

jQuery где-то в вашем html находит 2 source_div элементов и добавляет их оба.

2) Если вы прикрепите элемент 1 source к 2 destination , например:

$("destination").append("source");

вероятно, в вашем html у вас есть 2 destination элементов:

<div>
    <div class="destination"></div>
    ......
    <div class="destination"></div>
</div>

Answer 2

Может быть, это вызвано всплывающим событием. (Просто предположение, если больше никакой информации не имеется)

Если предположить:

<script  type="text/javascript">
jQuery(
  function($)
  {
    $('div')
      .click(function(e)
             {
              $('span',this).append('A');
             }
            );
  }
);
</script>
<div><div><b>click here:</b><span></span></div></div>

, если вы нажмете на текст,щелчок активирует внутренний div и всплывает до внешнего div, функция будет выполняться 2 раза.

Чтобы избежать этого, используйте stopPropagation ()

<script  type="text/javascript">
jQuery(
  function($)
  {
    $('div')
      .click(function(e)
             {
              e.stopPropagation();
              $('span',this).append('A');
             }
            );
  }
);
</script>
<div><div><b>click here:</b><span></span></div></div>