Блог

Я пытаюсь создать ссылку «нажмите, чтобы добавить», по которой пользователь может нажимать столько раз, сколько необходимо. Каждый раз, когда они нажимают на него, появляются 3 дополнительных поля ввода. Для этого у меня есть jQuery, который загружает PHP-файл, который создает 3 дополнительных входных параметра, а затем загружает их в существующий контейнер div.

Моя проблема в том, что после того, как пользователь один раз нажал ссылку «нажать, чтобы добавить» и увидел 3 новых поля ввода, если он нажмет «нажать, чтобы добавить» во второй раз, начальные 3 поля будут удалены из-за добавления новых 3 полей. Как я могу исправить это, чтобы при каждом нажатии пользователем добавлялось 3 поля, а предыдущие также сохранялись.

(ПРИМЕЧАНИЕ: я рассматривал возможность использования append () в сочетании с jQuery, который у меня есть ниже, но я, должно быть, получаю неправильный синтаксис, если это действительно лучшее решение).

Мой jQuery здесь:

     var loadPHP = "create_new_bucket.php";  
    $(".add_bucket").click(function(){  
        $("#tree_container2").load(loadPHP);
        return false;
    });  
  

jQuery.load() всегда заменяет содержимое в контейнере. Один из способов обойти это — добавить новый элемент к объекту и заполнить этот элемент новым HTML-кодом.

Пример:

 $('#tree_container2').append( $('<div />').load(loadPHP) );
  

Попробуйте это в вашем обработчике кликов

 $.get(loadPHP, function(data){
    $('#tree_container2').append(data);
}, 'html');