javascript - methods for dynamically created divs -


so i'm working on creating web app allows users create front end theme website; i'm doing better js skills.

what i'm doing in code below creating "boxes" span width of page, , want allow user edit each individual box.

the issue i'm facing can select class/id user clicked along div have set elements user wants; cannot seem attach dom methods onto object.

errors uncaught typeerror: object editboxes has no method 'innerhtml' 'innerhtml' can method. i've tried jquery's .html same result.

     for(i=1; <= boxes; i++) {                     box.innerhtml = box.innerhtml + [                     "<div class = 'globalbox' id = 'box"+i+"'>",                     "<div class = 'editdybox'>edit box <div class = 'editboxes'></div<!--end edit boxes--></div>",                     "</div><!--end box-->",                            ].join('');                     }//end                  $(".globalbox").css("width", width+"%");                       $(".editdybox").click(function(){                        var parentclass = $(this).parent().attr("id");                        var childclass = $(this).children().attr("class");                        var customedit = $(this).attr("class");                        var editboxform = "<form class = 'editboxform'><input type = 'text' name = '"+parent+"' width = '100%'></form>";                         childclass.innerhtml("hello")                     });//end editdybox click 

thank -art

why don't use contenteditable instead of complex code? it's designed that.

check out demo

<div contenteditable="true">i'm content</div> 

it's supported all browsers (yeah, ie5)

its normal div, spans available width, , content editable. no js or css nedded.


Comments

Popular posts from this blog

java.util.scanner - How to read and add only numbers to array from a text file -

rewrite - Trouble with Wordpress multiple custom querystrings -