2016-05-26 3 views
0

Я создаю дерево с данными JSON. Основная идея: каждый узел - div и каждый дочерний div тоже. Проблема в том, когда я нажимаю дочерний div, функция click работает более 1. Как я могу исправить эту проблему? Благодарю. Редактировать: Когда я пытаюсь определить onclick перед добавлением, проблема остается. Это моя функция дерева.Повторяющаяся функция -JS

function setTree(path){ 


    function Node(id) { 
    this.id = id; 
    this.children = {}; // object 
} 
    tree = new Node('root'); 

    path.forEach(function (a) { 
    var parts = a.split('--->'); 
    parts.reduce(function (r, b) { 
     if (!r.children[b]) { 
      r.children[b] = new Node(b); 
      createDiv(r.id,b); 
     } 
     return r.children[b]; 
    }, tree); 
}); 
document.getElementById('out').innerHTML = JSON.stringify(tree, 0, 4); 
} 

И это моя функция создания div.

function createDiv(root,name) 
    { alert("r ve b " +root+" " +name); 
     var output = document.getElementById(root); 

    if(!document.getElementById(name)) 
     { 
      var ele = document.createElement("div"); 
      ele.setAttribute("id",name);     
      ele.setAttribute("class","impact"); 
      ele.innerHTML="<a><img src='../resources/images/plusIcon.png' border=0 /></a>" + name; //a onclick='clickIcon()' 
      output.appendChild(ele); 
      ele.onclick = function() {divClick();}; 
     } 
    } 

EDIT: Решение:

ele.onclick = function(e){ 
       e.stopPropagation(); 
       divClick(ele.id); 
      };}; 

ответ

0

Вы отводки своих div элементов, и каждый из них имеет onclick событие, так что вы будете называть divClick() один раз для каждого div в дереве. См. this answer, чтобы посмотреть, как обрабатывать только самое верхнее событие div.

+0

что делать, если у меня есть другой параметр для функции? Является ли функциональным тестом (e, parameter2) для e.stopPropagation()? –

+0

ele.onclick = function (e) { e.stopPropagation(); divClick (ele.id); };}; есть работа. Благодарю. –

Смежные вопросы