Как сделать динамически добавление или удаление кнопки

-1

Когда я нажимаю кнопку «Добавить», она меняет кнопку удаления. Но я не могу изменить кнопку удаления, чтобы снова добавить кнопку, когда я нажимаю remove.Как сделать динамически добавление или удаление кнопки

<head> 
<script type="text/javascript" src="assets/js/jquery-2.0.3.min.js"> </script> 

<script type="text/javascript" > 
    $(document).ready(function() 
    { 
     $(".add").click(function(){ 
      var element = $(this); 
      var I = element.attr("id"); 
      var info = 'id=' + I; 

      $("#" + I).attr("class", "remove"); 
      $(".remove").text("Remove"); 
      return false; 
     }); 
    }); 
</script> 
<script type="text/javascript" > 
    $(document).ready(function() 
    { 
     $(".remove").click(function(){ 
      var element = this.id; 
      var I = element.attr("id"); 
      var info = 'id=' + I; 

      $("#" + I).attr("class", "add"); 
      $(".add").text("add"); 
      return false; 
     }); 
    }); 
</script>

<a class="add" id="1" href="#"> Add </a>

источник

2016-04-07 Oo Aung Htet Paing

protip: 'this.id' использовать собственную область DOM, чтобы сэкономить накладные расходы jQuery –

Можете ли вы показать свой HTML тоже, пожалуйста, трудно угадать, какие классы у вас есть по умолчанию. – Stuart

Add –

При изменении DOM элементов с JQuery, все, что загружается в $ (документ) .ready() не распознает изменения. Что вы можете сделать, это обернуть каждый шаг функции, вызовите их на document.ready, затем созвонимся снова в конце другой функции:

<script type="text/javascript" > 

    $(document).ready(function() 
    { 
     addFunction(); 
     removeFunction(); 
    }); 

    function addFunction(){ 
      $(".add").click(function(){ 
       var element = $(this); 
       var I = element.attr("id"); 
       var info = 'id=' + I; 
       $("#result").text(I); 
       $("#" + I).attr("class", "remove"); 
       $(".remove").text("Remove"); 
       removeFunction(); 
       return false; 
      }); 
    } 
    function removeFunction(){ 
     $(".remove").click(function(){ 
      var element = $(this); 
      var I = element.attr("id"); 
      var info = 'id=' + I; 
      $("#result").text(I); 
      $("#" + I).attr("class", "add"); 
      $(".add").text("add"); 
      addFunction(); 
      return false; 
     }); 
    } 
</script>

источник

2016-04-07 19:02:01

спасибо Mohammed Alsaedi –

Нет проблем! Я просто заметил ваш HTML, кажется, что вы можете удалить первый вызов removeFunction() из document.ready, так как этот класс добавляется только через jQuery позже. –

У вас есть обе функции, перечисленные в document.ready, так что вы не может прикреплять обработчик события к классу .remove, так как он еще не существует. Я предложил бы использовать делегированные события:

$(".LocationOfYourButtonInTheDom").on("click", "ThingBeingClicked", function() { 
    //code here 
});

Edit: ThingBeingClicked будет тип объекта DOM вызывая событие, в вашем случае это будет «» метки

Вы можете прочитать больше о событиях и делегация из jquery "on" documentation.

источник

2016-04-07 19:02:25 Culyx

Как сделать динамически добавление или удаление кнопки

ответ

Смежные вопросы