Not working eventlistener in html element
Question
I am trying to add eventlistener to a html element but not showing any desired output
My code is as follows:
.html file
<body ng-app="app">
<div class="container" >
<div class="table_set_up_conn">
<div class="set_up_conn">SETTING UP YOUR CONNECTION</div>
</div>
<div class="table_image_anim">
<img id="#image_anim" src="../Images/p1.png"/>
</div>
<div class="grey_layout_anim">
<div class="bold_write"><br>Now let's connect to your Clipsal Hub</div>
<div class="norm_write">1. Go to the Wi-Fi settings on your phone<br><br>2. Connect to the Clipsal Hub network<br><br>3. Return to this app when you're done<br><br></div>
</div>
<div class="table_centre_image">
<img id="#centre_image" src="../Images/p2.png"/>
</div>
</div>
<script src="../Java_Script/button_click.js"></script>
</body>
.js file
var image_anim = document.getElementById("#image_anim");
image_anim.addEventListener("webkitAnimationStart", animationListener_start,false);
image_anim.addEventListener("webkitAnimationIteration", animationListener_it,false);
image_anim.addEventListener("webkitAnimationEnd", animationListener_end,false);
function animationListener_start()
{
console.log('animation start');
}
function animationListener_it()
{
console.log('animation iterating');
}
function animationListener_end()
{
console.log('animation end');
}
Here i have performed a animation on "#image_anim" and i want to attach a event handler as u could see in my js code.But there is no message displayed in the log
1 answers
solution1
1 ACCPTED 2014-11-07 03:18:18
Until HTML 5, there were restrictions on the value of an ID that required it to start with a letter (generally the restrictions weren't enforced anyway, but most markup complied). However, in HTML 5, pretty much all restrictions on IDs are removed:
The value must be unique amongst all the IDs in the element's home subtree and must contain at least one character. The value must not contain any space characters.
Note : There are no other restrictions on what form an ID can take; in particular, IDs can consist of > just digits, start with a digit, start with an underscore, consist of just punctuation, etc.
It is most likely that you are loading the script file in the head and the element doesn't exist when it's executed. Move the script element to just before the closing body tag (or bottom of the document). If that doesn't work, tell us what browser you're using. The following works fine in Safari, Chrome, Firefox and Omniweb:
<div id="#foo">#foo</div>
<script>
alert(document.getElementById('#foo').innerHTML);
</script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.