Форум

AdDa · #1 (**permalink**) 21.03.2013, 11:36

Вот у меня функция добавления элемента
$('button.add-link').click(function(e) {

var parentEls = $('#link-project').val();
$("#link").append('<label><a href="http://'+parentEls+'">'+parentEls+'</a><img id="close" src="images/close-link.png"/></label>');
e.preventDefault();
})
Как мне удалить элемент при клике на close-link.png ?

danik.js · #2 (**permalink**) 21.03.2013, 11:49

$('#close').click(function(e) {
    $(this).closest('label').remove();
})

AdDa · #3 (**permalink**) 21.03.2013, 19:10

Что то не работает...
При клике создается блок
<label>
<a href="http://as">as</a>
<img id="close-link" src="images/close-link.png">
</label>
но не удаляется Вашей функцией.

danik.js · #4 (**permalink**) 21.03.2013, 19:36

Потроллить решил?

Сообщение от AdDa

<img id="close"

Сообщение от AdDa

<img id="close-link"

...

блок точно в единственном экземпляре? Иначе картинки получат одинаковые имена (id) и как их тогда различать?

AdDa · #5 (**permalink**) 21.03.2013, 21:00

прошу прощения, опечатался...

(function($) {
$(function() {   

	$('button.add-link').click(function(e) {
		 
			var parentEls = $('#link-project').val();  
			$("#link").append('<label><a href="http://'+parentEls+'">'+parentEls+'</a><img id="close-link" src="images/close-link.png"/></label>');
			e.preventDefault(); 
	}) 
	
	
	$('#close-link').click(function(e) {
    $(this).closest('label').remove();
})

 
})
})(jQuery)

Вот весь код , блок создаётся следующий

<label><a href="http://dasdas">dasdas</a><img id="close-link" src="images/close-link.png"></label>

, но не удаляется
Да блок в единственном экземпляре

danik.js · #6 (**permalink**) 21.03.2013, 21:15

Обработчик для #close-link нужно навешивать только когда этот элемент существует. А существовать он начинает после $('#link').append(...

Альтернативный вариант - делегировать обработку клика родительскому элементу (всегда существующему) через $(parent).on('click' , '#close-link', fn)

AdDa · #7 (**permalink**) 21.03.2013, 21:32

поясните пожалуйста , куда мне вставить эту строчку то ?

danik.js · #8 (**permalink**) 21.03.2013, 21:50

Сообщение от danik.js

после $('#link').append(

AdDa · #9 (**permalink**) 21.03.2013, 23:24

чёт нифига не получается... или я не туда пихаю эту строчку

рони · #10 (**permalink**) 22.03.2013, 01:08

AdDa,

<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script>
  (function ($)
    {
      $(function ()
        {
        $('input.add-link').click(function(e){
            var parentEls = $('#link-project').val();
              $("#link").append('<label><a href="http://' + parentEls + '">'
              + parentEls
              + '</a><img id="close-link" src="http://javascript.ru/forum/images/smilies/no.gif"/></label>');
              $('#close-link').click(function (e)
                {
                  $(this).closest('label').remove();
                }
              )
              e.preventDefault();

        });
       }
      )
    }
  )(jQuery)
  </script>
</head>

<body>
<input id="link-project">
<input value="add-link" class="add-link" type=button>

<div id="link"></div>
</body>

</html>

Форум

Справочник

Discord чат

Курсы javascript