www.webdeveloper.com
Results 1 to 1 of 1

Thread: [RESOLVED] HTML5 File API multiple times (how do I explain this?)

Hybrid View

  1. #1
    Join Date
    Jun 2012
    Posts
    13

    resolved [RESOLVED] HTML5 File API multiple times (how do I explain this?)

    If your familiar with the HTML 5 File API, it can display images on the browser using a call
    <div id="display"> in html.


    I've been trying to figure out how I can use the HTML5 FileReader API
    to output it's content into each repeated <div id=""> <div id=""> <div id=""> <div id=""> using the same Id or class.


    See Example:
    http://jsfiddle.net/2xES5/38/


    (Example: A div gets created on click, within each Div lies a call (id="list") to display images using the File API.

    Filereader isn't recognizing multiple instances with the same div id element name.
    It's only showing the images in one created Div, I really want the images repeated for each consecutive one.



    The API refers to:
    document.getElementById --

    I could replace it with either of these so called "node list structured arrays":

    Code:
    document.querySelectorAll("");
    document.getElementsByClassName
    It was suggested to me something like this,
    but my javascript knowledge isn't solid and implementing it is difficult. Sorry!


    Code:
    var nodeList = document.querySelectorAll("#list");
    console.log(nodeList);
    console.log(nodeList.toString());
    for (var i = 0; i < nodeList.length; i++) {
      var node = listList[i];
    
       var span = document.createElement("span");
       span.appendChild(document.createTextNode("A span!");
       node.insertBefore(span, null)
    }
    ----------------------------------------------------------------------
    Last edited by MavisBecon; 08-14-2014 at 09:13 PM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles