HTML元素中的EventListener無法正常工作

Question

我正在嘗試將eventlistener添加到html元素，但未顯示任何所需的輸出

我的代碼如下：

.html文件

    <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文件

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');
}

在這里，我已經在“ #image_anim”上執行了動畫，並且想要附加一個事件處理程序，就像您在我的js代碼中看到的那樣。

Answer 1

在HTML 5之前，對ID值的限制是要求ID以字母開頭（通常不會強制執行限制，但是大多數標記已得到遵守）。 但是，在HTML 5中，幾乎消除了對ID的所有限制：

該值在元素的主子樹中的所有ID中必須唯一，並且必須至少包含一個字符。 該值不得包含任何空格字符。

注意：ID可以采用什么形式沒有其他限制； 尤其是，ID可以包含>僅數字，以數字開頭，以下划線開頭，僅包含標點符號等。

最有可能是您將腳本文件加載到頭部，並且該元素在執行時不存在。 將腳本元素移到結束body標記（或文檔底部）之前。 如果那不起作用，請告訴我們您正在使用哪種瀏覽器。 以下在Safari，Chrome，Firefox和Omniweb中可以正常運行：

<div id="#foo">#foo</div>

<script>
alert(document.getElementById('#foo').innerHTML);
</script>

HTML元素中的EventListener無法正常工作

問題描述

1 個解決方案

解決方案1
1 已采納 2014-11-07 03:18:18

HTML元素中的EventListener無法正常工作

問題描述

1 個解決方案

解決方案1 1 已采納 2014-11-07 03:18:18

解決方案1
1 已采納 2014-11-07 03:18:18