2016-09-16 2 views
0

ЗдравствуйтеВызов функции на себя с помощью динамически создаваемых элементов

Итак, у меня есть некоторые JS код, который создает HTML элементы динамически. Точнее, он создает div элементы, которые также имеют некоторые другие вещи внутри них.

Каждый из этих элементов div имеет элемент img внутри них. Как я могу добиться такого эффекта, что когда элемент img щелкнут в определенном элементе div, этот точный элемент div будет удален?

Это мой код, который создает элементы динамически:

function addQuestion(question){ 
 
    var s = "<div style=\"width:100%;background-color:transparent;border-top:none;border-bottom:2px solid white;border-right:none;border-left:none;\"><div style=\"margin:5px;font-family:Verdana;color:white;\">"+"<p>"+noTag(question)+"</p>"+"</div></div>"; 
 

 
    var div = document.createElement('div'); 
 
    div.innerHTML = s; 
 
    document.getElementById("div_questions").appendChild(div); 
 
}

В настоящее время он не создает img элемента. Но идея состоит в том, что в каждом из этих элементов div он также создает элемент img, который при нажатии удаляет и что толькоdiv элемент.

Как я могу это достичь?

+0

Кроме того, чтобы удалить DIV, вы можете использовать '$ (это) .closest ('Div_selector'). Удалить()' – Rajesh

+0

Где добавляется IMG тег? Не видите элемент img в динамически добавленном контенте. – majita

ответ

0

попробовать следующий код ....

  var _cotainerDiv = document.getElementsById("holderDiv"); 

      var _tempDiv = document.createElement("div"); 
      $(_tempDiv).css({ 
       //Css properties... 
      }); 

      _cotainerDiv.appendChild(_tempDiv); 

      var _tempImg = new Image(); 
      _tempImg.src = "...../imagePath"; 
      _tempImg.onload=function(){ 
       this.addEventListener("click", onImageClick); 
      } 
      _tempDiv.appendChild(_tempImg); 


      function onImageClick(event) 
      { 
       var _curImg = event.target; 

       _cotainerDiv.removeChild(_curImg.parentElement); 
      } 
Смежные вопросы