将事件侦听器添加到Inner类

时间:2015-08-20 10:15:59

标签: javascript html

我正在尝试向'Subclass'添加一个事件监听器(这就是它所谓的?)。但它没有生效。

JS:

var Station_Button = function(status_id) 
{
      var alert_txt, class_txt;

      switch( status_id )
      {
        case 1:
        {
            alert_txt = "<strong>Complete!</strong> This Station is complete.";
            class_txt = "alert alert-success";
        }
        case 2:
        {
        alert_txt = "<strong>Error!</strong> This Station has failed!";
            class_txt = "alert alert-info";
        }
      }

      document.getElementById("notify").innerHTML = alert_txt;
      document.getElementById("notify").className = class_txt;
      return false;
}

var ta_butt = document.getElementsByClassName("ta_butt.error");

for(var i=0;i<ta_butt.length;i++)
{
    ta_butt[i].addEventListener('click', function() {Station_Button(2)}, false);
}

如果我带走了.error,它可以正常工作,但这当然会将事件应用到我所有的'ta_butt'按钮 - 我只希望它出现在标记为错误的按钮上。

如果它对CSS感兴趣的话:

.ta_butt {
    color: white;
    border-radius: 7px;
    font-size:150%;
    text-align:center;
    float: left;
    margin: 1px;
    width: 100%;
    padding: 1px;
    cursor: pointer;
    cursor: hand;
    background: -webkit-linear-gradient(top, #0066FF, #4D94FF); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom, #0066FF, #4D94FF); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom, #0066FF, #4D94FF); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom, #0066FF, #4D94FF); /* Standard syntax (must be last) */
}

.ta_butt.error {
    background: -webkit-linear-gradient(top, #CC0000, #DB4D4D); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom, #CC0000, #DB4D4D); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom, #CC0000, #DB4D4D); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom, #CC0000, #DB4D4D); /* Standard     syntax (must be last) */
}

.ta_butt.error:hover {
    background: -webkit-linear-gradient(top, #DB4D4D, #CC0000); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom, #DB4D4D, #CC0000); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom, #DB4D4D, #CC0000); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom, #DB4D4D, #CC0000); /* Standard syntax (must be last) */
}

1 个答案:

答案 0 :(得分:0)

对于多个类,请在类名之间使用空格:

var ta_butt = document.getElementsByClassName("ta_butt error");