Событие Onclick для динамически созданного элемента html в цикле for

У меня есть объект json с данными, подобными дереву. Я бы хотел отобразить его на интерфейсе пользователя в интерактивном режиме. При нажатии компонента его дети должны отображаться и так далее. Я написал следующий кодСобытие Onclick для динамически созданного элемента html в цикле for

  <!DOCTYPE html> 
      <html> 
      <head> 

      <script src="jquery-1.9.1.js"></script> 
      </head> 
      <body> 
      <div> 
       <ul id="result"></ul> 

      </div> 
      <script> 
      var json_data = { 
       "component": "A", 
       "status": 0, 
       "children": [ 
        { 
         "component": "AA", 
         "status": 0, 
         "children": [ 
          { 
           "component": "AAA", 
           "status": 0, 
           "children": [] 
          }, 
          { 
           "component": "AAB", 
           "status": 2, 
           "children": [] 
          } 
         ] 
        }, 
        { 
         "component": "AB", 
         "status": 0, 
         "children": [ 
          { 
           "component": "ABA", 
           "status": 0, 
           "children": [] 
          }, 
          { 
           "component": "ABB", 
           "status": 1, 
           "children": [] 
          } 
         ] 

        } 
       ] 
      }; 

      $(document).ready($(function(){ 
       var $result = $('#result'); 
       start(json_data) 
       //Root Node display 
       function start(obj) 
       { 

        $('<li id="' + obj.component + '">').text(obj.component + '-'+obj.status).appendTo($result); 
        $("#"+obj.component).click(function(){ 
         displaychildren(obj); 
        }); 

       } 
       Display the children of an element on click by recursion 
       function displaychildren(node) 
       { 
        $.each(node.children,function (i,v){ 
          $('<li id="' + v.component + '">').text(v.component + '-'+v.status).appendTo($result);              
          if$("#"+v.component).click(function(){ 
          alert("Problem is here"); 
          displaychildren(v); 
          }); 

         });      
       } 
       });

Проблема, с которой я столкнулся, - это то, что элемент в функции displaychildren не работает. Если условие onclick удалено, все элементы всех компонентов выгружаются. Я хочу, чтобы дочерние элементы выбранного компонента отображались только. Кто-нибудь знает, что является причиной проблемы

источник

2013-04-09 Praneeth

Там есть ошибка в вашем синтаксисе:

if$("#"+v.component).click(function(){

должно быть (если вы имели в виду, чтобы это было это):

if($("#"+v.component).click(function(){

Я предполагаю, ваш код следует читать:

$("#"+v.component).click(function(){ 
          alert("Problem is here"); 
          displaychildren(v); 
          }

как if() здесь не имеет смысла здесь вокруг события click.

источник

2013-04-09 10:50:24

Ничего себе просто ничего себе ........... он работал просто путем удаления if ..... я думал, что все эти дни ошибка была в моем представлении объекта. Большое спасибо dixon :) – Praneeth

Нет проблем, иногда это просто берет свежую пару глаз на кусок кода :) –

Событие Onclick для динамически созданного элемента html в цикле for

ответ

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