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

这里我在＆＃34;＃image_anim＆＃34;上执行了动画。我想附加一个事件处理程序，你可以在我的js代码中看到。但是日志中没有显示消息

Answer 1

在HTML 5之前，对ID的值有限制，要求它以字母开头（通常不会强制执行限制，但大多数标记都符合）。但是，在HTML 5中，pretty much all restrictions on IDs已被删除：

该值必须在元素主页中的所有ID中唯一   子树，必须包含至少一个字符。价值不能   包含任何空格字符。

注意：ID可以采取的形式没有其他限制;特别地，ID可以由＆gt;组成。只是数字，以数字开头，以下划线开头，仅包括标点符号等。

您最有可能在脚本中加载脚本文件，并且元素在执行时不存在。将脚本元素移动到关闭正文标记（或文档底部）之前。如果这不起作用，请告诉我们您正在使用的浏览器。以下在Safari，Chrome，Firefox和Omniweb中运行良好：

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

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

不在html元素中使用eventlistener

1 个答案: