2016-12-16 9 views
0

dom内の最後に追加された要素の背景を変更したいと思います。 JSファイルで、私はcheck-in-notification-appendに要素を追加し動的追加要素の背景を変更します

<div class="check-in-wrapper"> 
     <div class="ui-grid-a"> 
     <div class="ui-block-a"> 
      <span class="ticket-img"> 
       <img class="image" src="img/icons/ticket.png"> 
      </span> 
     </div> 

     <div class="ui-block-b"> 
      <h4>Inchecken</h4> 
      <div class="check-in-notification-append"></div> 
     </div> 
     </div> 
    </div> 

    <div class="douane-wrapper"> 
     <div class="ui-grid-a"> 
     <div class="ui-block-a"> 
     <span class="douane-img"> 
      <img class="douane-img image" src="img/icons/douane.png"> 
      </span> 
     </div> 

      <div class="ui-block-b"> 
      <h4>Douane</h4> 
      <div class="douane-notification-append"></div> 
     </div> 
     </div> 
    </div> 

    <div class="gate-wrapper"> 
    <div class="ui-grid-a"> 
    <div class="ui-block-a"> 
     <span class="gate-img"> 
     <img class="gate-img image" src="img/icons/gate.png"> 
     </span> 
    </div> 

    <div class="ui-block-b"> 
    <h4>Gate</h4> 
     <div class="gate-notification-append"></div> 
     </div> 
    </div> 

douane-in-notification-appendgate-in-notification-appendここでより良い外観:ここにあなたがより良い外観を与えるためには、HTMLです。

$(document).on("pagebeforeshow","#progress",function(){ 

    var incheckHtml = ''; 
    var douaneHtml = ''; 
    var gateHtml = ''; 

    for(var count = 0; count < info.data.length; count++){ 
     var shortmessage = info.data[count][3]; 
     var category = info.data[count][4]; 
     var typeOf = info.data[count][5]; 

     if(typeOf === "warning"){ 
      imgPath = 'img/icons/alarm.png'; 
     } else { 
      imgPath = 'img/icons/alert.png'; 
     } 


     if (!Array.prototype.last){ 
      Array.prototype.last = function(){ 
       return this[this.length - 1]; 
      }; 
     }; 


     if (category === 'inchecken'){ 
      incheckHtml = incheckHtml + "<div class='notification-item'><img class='notification-image' src=" + imgPath + "><span class='notification-text'>" + shortmessage + "</span></div>"; 
      // $('.check-in-wrapper').empty().prepend(incheckHtml); 
      $('.check-in-notification-append').empty().prepend(incheckHtml); 
     } 

     if(category === 'douane'){ 
      douaneHtml = douaneHtml + "<div class='notification-item overlay'><img class='notification-image' src=" + imgPath + "><span class='notification-text'>" + shortmessage + "</span></div>"; 
      $('.douane-notification-append').empty().prepend(douaneHtml); 
     } 

     if(category === 'gate'){ 
      gateHtml = gateHtml + "<div class='notification-item overlay'><img class='notification-image' src=" + imgPath + "><span class='notification-text'>" + shortmessage + "</span></div>"; 
      $('.gate-notification-append').empty().prepend(gateHtml); 
     } 
    } 
}); 

しかし、どのように私はクラス"overlay"を除去する任意のカテゴリ内の最後に追加された要素をアクセスもありません。最後に追加された要素とremoveClassオーバーレイへのアクセスを誰かが助けてくれることを願っています。私は.last() functionを書いていますが、これは私に配列の最後のオブジェクトの出力を与えるだけです...

答えて

1

私はあなたが影響を受ける可能性があり、Jqueryのを使用するすべての要素に適用するいくつかの共通のセレクタを持つことによってこれを達成できると思いますlast()関数。

$(".allMyThings").last().removeClass("overlay"); 

https://api.jquery.com/last/

+0

私はこのようにそれを行う場合: '$( '通知アイテム。 ')最後の()removeClass(' オーバーレイ');'それはすべての最後からクラスを削除しますより。各セクションでしかし、私はどのようにすべての最後のクラスからそのクラスを削除するのですか? – Sreinieren

関連する問題