append div не работает

Question

У меня большая проблема. Я пытаюсь добавить новый div, но он не работает.

Моя функция:

jQuery(function($){ 
    var $meter = $('#analog_meter'), count = 1; 
    $('#addanalog').click(function(e){ 
     e.preventDefault(); 
     if(count > 2){ 
      alert("That's enough already!"); 
      return; 
     } 
     count ++; 

     ($meter.parent()).append($meter.clone()); 
    }); 
}); 

И мой пример кода для построения мой аналог метр:

<div id="add" style="visibility:hidden;" style="display:inline-block;"><a id="addanalog" href="#" Onclick="add_new_analog();">ADD NEW ANALOG</a></div> 

<div id="plot_analog"> 
    <div id="analog_meter" name="analog_meter"> 
     <!-- less information --> 
     <div id="content-two" style="visibility:hidden;"> 
       <div id="chart1" class="jqplot-target"></div> 
       <a id="div-one" href="#" Onclick="mostra1();"><? echo LABEL_MORE_INFORMATION ?></a>&nbsp;&nbsp; &nbsp;&nbsp; 
       <a id="div-two" href="#" Onclick="mostra2();"><? echo LABEL_LESS_INFORMATION ?></a> 
     </div> 
     <!-- more information --> 
     <div id="content-one" style="visibility:hidden;"> 
      <div id="chart2" class="jqplot-target"></div> 
      <a id="div-one" href="#" Onclick="mostra1();"><? echo LABEL_MORE_INFORMATION ?></a>&nbsp;&nbsp; &nbsp;&nbsp; 
      <a id="div-two" href="#" Onclick="mostra2();"><? echo LABEL_LESS_INFORMATION ?></a> 
     </div> 
</div> 

</div> 

Что происходит то, что каждый раз, когда я нажимаю ДОВАБИТЬ ANALOG, участки двух аналоговых метров , вот так:

то, что я хочу, это то, что при нажатии кнопки, сюжет только один аналоговый счетчик.

любая идея, как мне помочь?

Answer 1

Вы можете попробовать удалить

Onclick="add_new_analog();" 

Видя, как вы подключите событие щелчка через JQuery. Если add_new_analog() добавляет аналог, и ваша функция jQuery добавляет аналог, вы в конечном итоге добавляете 2.

Редактировать: @ T.J. У Кроудера есть хорошая идея об идах. Вы должны убедиться, что они остаются уникальными при клонировании.

Answer 2

Вы добавили два clickhandlers к <a id="addanalog" href="#" Onclick="add_new_analog();">ADD NEW ANALOG</a>

Сначала путем добавления обработчика в onclick разметки, а второй в «коде» в файле JavaScript:

$('#addanalog').click(function(e){ // register second click handler 
    e.preventDefault(); 
    if(count > 2){ 
     alert("That's enough already!"); 
     return; 
    } 
    count ++; 

    ($meter.parent()).append($meter.clone()); 
}); 

Я думаю, что самый простой способ будет удалить один из них.