Приложите <отделение> щелчком и удалите с щелчком

У меня есть следующая проблема:

Я прилагаю отделение:

$(".class").click(function() {   
    $(this).append("<div class='click'></div>");
    $("div.click").show();
});

Тогда я удаляю его с щелчком по другой кнопке, но отделение все еще там.

$(".button").on("click", function(e){
    e.preventDefault();
    ...
    $("div.click").hide();
});
1
мое предположение - что-то в тех "..." вызывает ошибку - или функция щелчка .button не становится названной.
добавлено автор ek_ny, источник
какая-либо определенная причина помещения скрывает после preventDefault() ? почему не прежде? это будет ясно тот путь.
добавлено автор hitesh israni, источник
don' t понимают вашу проблему. вещь, которую вы спрашиваете, работает, как показано в вышеупомянутой скрипке.
добавлено автор hitesh israni, источник
Вы намереваетесь на самом деле , удаляют его? Или просто скройте его? Поскольку в настоящее время you' ре, только делающее последнего.
добавлено автор David, источник
покажите свой HTML...
добавлено автор Mohammad Adil, источник
jsfiddle.net/suhailvs/4VmYP да отделение там
добавлено автор suhailvs, источник
Укладчик щелчка на вашей кнопке, на самом деле будучи вызванным?
добавлено автор user1864610, источник

7 ответы

удалите "на" из

$(".button").on("click", function(e){
    e.preventDefault();
    ...
    $("div.click").hide();
});
2
добавлено
Чего это достигнет?
добавлено автор David, источник
Нет - не релевантный, насколько я вижу.
добавлено автор user1864610, источник

Попытайтесь держать указатель на отделение, следующее должно работать.

var tempDiv;
$(".class").click(function() {   
  tempDiv = $("<div class='click'></div>").appendTo($(this)).show();
});

$(".button").on("click", function(e){
  e.preventDefault();
  tempDiv.remove();
});

Иначе можно использовать этот путь

$(".class").click(function() {   
   $("<div class='click'></div>").appendTo($(this)).show();
});

$(".button").on("click", function(e){
  e.preventDefault();
  $('.click').remove();
});

PS: можно также удалить .show() , если .click класс не скрыт по умолчанию

1
добавлено
Try this

You have two buttons.

Say:

<div class="Main">
    <div>Div0</div>
</div>

<button class="button1">Click to add</button>
<button class="button2">Click to remove</button>


and JS Code is :

var counter=1;

$(".button1").click(function() {  

$('.Main').append("<div class='click'> newly added Div "+counter+"</div>");
counter++;
$("div .click").show();
});

$(".button2").click(function() {

$('.Main div').remove(':last-child');
});
1
добавлено

Когда вы динамично создаете элемент, вам нужно делегированное событие: .on (событие, отборщик, укладчик (eventObject)) .

$(document).on("click", ".button", function(e){
    e.preventDefault();
    ...
    $("div.click").hide();
});

Если вы хотите, удаляют элемент, вы использование shoud .remove() метод вместо .hide() .

0
добавлено

Here is an example based on your work : http://jsfiddle.net/UQTY2/128/

<div class="class">Click to add a green box</div>
<button class="button">Click to remove all green boxes</button>

$(".class").click(function() {
    $(this).append("<div class='click'></div>");
});

$(".button").click(function(e) {
    e.preventDefault();
    $("div.click").remove();
});
0
добавлено

это удалит

$(".button").on("click", function (e) {

    e.preventDefault();
    $("div.click").remove();
});

проверьте мою скрипку

http://jsfiddle.net/suhailvs/4VmYP/2/

0
добавлено

можно динамично добавить и удалить отделение с JavaScript как это

Проверьте этот пример

Добавляет и Удаляет Отделение динамично

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

Пример кода

HTML

<div class="Main">
    <div>div1</div>
</div>
<button id="ok">add</button>
<button id="del">remove</button>

<input id="V"/>
<button id="Vok">ok</button>

JS

var counter=0;
$("#ok").click(function(){
    $('.Main').append('<div> new div'+counter+'</div>');
    counter++;
})
$("#del").click(function(){
    $('.Main div').remove(':last-child');
})
$("#Vok").click(function(){
    var Val=$('#V').val();
    $('.Main div:nth-child('+Val+')').remove();
})
0
добавлено
JavaScript Jobs — чат
JavaScript Jobs — чат
8 336 участник(ов)

JavaScript Jobs — чат для поиска работы и людей Правила оформления: https://teletype.in/@telegram-ru/r1WQe5F1m См. также: @mobile_jobs, @devops_jobs, @nodejs_jobs, @react_js, @angular_ru, @js_ru

JavaScript.ru
JavaScript.ru
7 932 участник(ов)

Сообщество сайта JavaScript.ru в Slack.

pro.js
pro.js
4 675 участник(ов)

Про JavaScript и NodeJS Invite: https://t.me/joinchat/Be4rsT5Rsgq30DHutjxXgA Правила: http://telegra.ph/ru-chat-rules-06-19 Вакансии только с ЗП, не чаще раза в неделю.

Верстка сайтов HTML/CSS/JS/PHP
Верстка сайтов HTML/CSS/JS/PHP
3 439 участник(ов)

Правила группы: напишите !rules в чате. Группа Вк: vk.com/web_structure Freelancer: @web_fl Веб Дизайн: @dev_design Маркетолог: @topmarkening Автор: @M_Boroda

JavaScript — русскоговорящее сообщество
JavaScript — русскоговорящее сообщество
3 269 участник(ов)

Рекомендуем сразу отключить уведомления Правила: https://rudevs.network/ByaMH6un7 См. также: @js_noobs_ru, @nodejs_ru, @typescript_ru, @react_js, @electron_ru Вакансии и поиск работы: @javascript_jobs

JavaScript Noobs — сообщество новичков
JavaScript Noobs — сообщество новичков
2 484 участник(ов)

Чат для новичков

javascript_ru
javascript_ru
915 участник(ов)

Сообщество любителей самого популярного языка программирования в мире. Чат основан в 2009 году. Логи: https://goo.gl/9EOeM7 Поддержка бота: @chat_linker (ссылка на репу внутри) Вам будут интересны @frontend_ru и @css_ru

jsChat
jsChat
603 участник(ов)

Чат посвященный программированию на языке javaScript Перед отправкой ссылки на Ваш контент посоветуйтесь с админом Все ссылки удаляются ботом автоматически

JavaScript for Zombies Chat
JavaScript for Zombies Chat
492 участник(ов)

Чат про JavaScript для настоящих zombie! Вход строго по приглашениям! Ссылка для строгих приглашений: https://t.me/joinchat/AAMBHz3Uyr0tuZ7VaB029g

All That JS
All That JS
417 участник(ов)

JS на русском