SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Addict ketting00's Avatar
    Join Date
    Jul 2011
    Posts
    312
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)

    How to remove item from parent node after appending

    Hello,
    I pick an item to append to a parent node with this method:
    Code:
    for (var i = 0; i < 4; i++){
    	(function(x){
    		myLis[x].addEventListener("click", function() {
    			pickItem(x);
    		});
    	})(i);
    }
    function pickItem(x) {
    	var div = document.getElementById('addHere');
    	var audio = document.createElement('audio');
    	div.insertBefore(audio, div.childNodes[0]);
    }
    When you use the command console.log(div); it would shows up like this:
    Code:
    <div id="addHere">
    	<audio src="1.mp3"></audio>
    </div>
    But when I click on other items on the <li> list for the third time it would show up like this:
    Code:
    <div id="addHere">
    	<audio src="1.mp3"></audio>
    	<audio src="4.mp3"></audio>
    	<audio src="2.mp3"></audio>
    </div>
    All the songs are playing altogether (including three songs you clicked previously [first->one, second->two]) and cause browser aw snap (chrome).
    So how do I play only one song at the time.
    Thank you,

  2. #2
    SitePoint Member
    Join Date
    Sep 2013
    Posts
    13
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    If you only want one audio element, then why are you adding several? Why not just add one audio element and change its src?


Bookmarks

Posting Permissions

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