1

Всем привет! имеется некая страница с кнопкой, при нажатии на кнопку появляется "окошко", где можно ввести сообщение и отправить куда-то

<button id="addNewItem" onclick=addNewItem();>Добавить новый вид тестирования</button>

вызывается метод addNewItem()

function addNewItem() {
  //          var e = document.getElementById("textareaID");
  //          var str = e.value
  $("#container").append("\<meta charset=\"utf-8\">\n" +
    "\<div id=\"light\" class=\"white_content2\" style=\"display: block;\">\n" +
    "    \<H3>Добавление новогого элемента:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\n" +
    "        \<button id=\"closeDiff\" onclick=\"hideDiv(this);\">Закрыть &#10008;</button>\n" +
    "    \</H3>\n" +
    "    \<P>\n" +
    "\<p><textarea name=\"comment\" rows=\"20\" cols=\"80\" ID=\"textareaID\"></textarea></p>\n" +
    "\<button id=\"addNewItem\" onclick=\"ItemId('" + 123 + "');\"> Отправить</button>\n" +
    "\</P>\n" +
    "\</div>"
  );

}

function hideDiv(ele) {
  // document.getElementById('light').style.display='none';launch();
  var divName = ele.getElementById('light');
  var d = ele.getElementById('light').style.display = 'none';
  divName.hidePopup();
  d.hidePopup();
  $(divName).toggle();
  $(d).toggle();

}

function ItemId(text) {
  alert(text)
}

Выглядит это примерно так:

Итоговый результат

Подскаэите, пожалуйста, как закрыть этот div при нажатии на кнопк "Закрыть" ?

вот рабочий код

      function addNewItem() {
        // var e = document.getElementById("textareaID");
        //var str = e.value
        $("#container").append("\<meta charset=\"utf-8\">\n" +
          "\<div id=\"light\" class=\"white_content2\" style=\"display: block;\">\n" +
          "    \<H3>Добавление новогого элемента:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\n" +
          "        \<a href = \"javascript:void(0)\" onclick = \"document.getElementById('light').style.display='none';launch();\">Закрыть &#10008;</a>\n" +
          "    \</H3>\n" +
          "    \<P>\n" +
          "\<p><textarea name=\"comment\" rows=\"20\" cols=\"80\" ID=\"textareaID\"></textarea></p>\n" +
          "\<button id=\"addNewItem\" onclick=\"ItemId('" + 123 + "');\"> Отправить</button>\n" +
          "\</P>\n" +
          "\</div>"
        );

      }

но каждый раз, когда нажимаю "Добавить новый вид тестирования" второй раз, пояаляется новый div и больше не закрывается.

1
  • Когда вы скрываете оно там же остается тока невидимым. когда добавляете второй у вас получается 2 объекта с одинаковым ID. для javascript ID должен быть уникальным. думаю из за этого
    – HELO WORD
    23 мая 2016 в 12:29

1 ответ 1

1

Вот работающий код. Удаляю старый div и добавляю новый

 function addNewItem() {
   $("#container").append("\<meta charset=\"utf-8\">\n" +
     "\<div id=\"light\" class=\"white_content2\" style=\"display: block;\">\n" +
     "    \<H3>Добавление нового элемента:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\n" +
     "        \<button id=\"closeDiff\" onclick=\"removeElement('container','light');\">Закрыть &#10008;</button>\n" +
     "    \</H3>\n" +
     "    \<P>\n" +
     "\<p><textarea name=\"comment\" rows=\"20\" cols=\"80\" ID=\"textareaID\"></textarea></p>\n" +
     "\<button id=\"addNewItem\" onclick=\"sendNewItem(this);\"> Отправить</button>\n" +
     "\</P>\n" +
     "\</div>"
   );

 }



 function removeElement(parentDiv, childDiv) {
   if (childDiv == parentDiv) {
     alert("The parent div cannot be removed.");
   } else if (document.getElementById(childDiv)) {
     var child = document.getElementById(childDiv);
     var parent = document.getElementById(parentDiv);
     parent.removeChild(child);
   } else {
     alert("Child div has already been removed or does not exist.");
     return false;
   }
 }

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.