2016-08-05 56 views
-2

SampleImageJavascript: Wie man Zelle bgcolor über gegenwärtigem Zellen-Element erhält?

<tr> 
    <td></td> 
    <td bgcolor = "Brown"></td> 
    <td></td> 
</tr> 

<tr> 
    <td></td> 
    <td id="current"></td> 
    <td></td> 
</tr> 

Wie verwende ich Javascript um die bgcolor der Zelle über einer Zelle der ID der Zelle als Verweis auf die gewählte Zelle unter Verwendung erhalte dann vergleichen, wenn der bgcolor Brown gleich ist?

EDIT:

function move2(barName, start, currentCell, totSec,barLength) { 
    var no = start; 
    var current = currentCell; 
    var totalSec = totSec; 
    var span = no - current; 
    var bar = barName + no; 
    var lengthCount = 0; 
    var progLength = barLength - 1; 
    var elem = document.getElementById(bar); 
    var width = 0; 
    var stop = 0; 
function fill(){ 
     while(no < current){ 
      if(lengthCount >= progLength){ 
       stop = 1; 
       break; 
      } 
      elem.style.width = '100%'; 



    if ($(this).parent().next().children("elem").index() == "Brown") { 
    elem.className = 'progress-bar progress-bar-danger'; 
    } 


     no++; 
     bar = barName + no; 
     elem = document.getElementById(bar); 
     lengthCount++; 
     stop = 0; 
    } 

    } 

}

Leider haben meine Versuche, einige jQuery-Codes versucht, ich auf einigen anderen Beiträgen gefunden habe, wo die Probleme irgendwie ähnlich sind, aber ich einfach nicht bekommen die Eltern- und Kindermethoden. Ich arbeite an einem Fortschrittsbalken, wo, wenn die Zelle darüber (Zeile für Zeiträume) braun ist (Break Time) der Fortschrittsbalken rot werden sollte, wodurch die Klasse der Standardzelle von Fortschrittsbalken-Erfolg zu Fortschrittsbalken geändert wird. Gefahr, wenn die darüber liegende Zelle braun ist.

+2

Sie keine IDs haben, noch haben Sie einen Code zu zeigen, dass Sie es sogar versucht haben, und Sie verwenden ein veraltetes TD-Attribut (bgcolor) - aber das ist in Ordnung, jemand wird Ihre Arbeit für Sie in kürzester Zeit tun –

+1

Wie @JaromandaX sagte, bitte bieten Sie Ihre aktuelle Arbeit. – Joundill

Antwort

0

Ich ging diesen praktisch die gleiche Weise wie Sandip, wenn auch sans die Verwendung von jQuery. Zuerst habe ich den Browser gebeten, meine Funktion aufzurufen, wenn die Seite fertig geladen ist. Als Nächstes erweitere ich den HTMLCollection-Datentyp, sodass wir die forEach-Funktion des Array-Datentyps auf einer HTMLCollection verwenden können.

Sobald dies erledigt ist, ruft die Seite unseren Code auf und lokalisiert sofort die Zelle, die wir suchen (t1). Nachdem wir dies getan haben, gehen wir einfach durch die rows Sammlung der Tabelle, um diejenige zu finden, die mit dem Elternknoten unseres t1 übereinstimmt - dies wird die Zeile sein, die sie enthält. Als nächstes gehen wir durch die Zellensammlung und suchen erneut nach der t1-Zelle - das bedeutet, dass wir jetzt sowohl die Zeilen- als auch die Zellenindizes unseres anfänglichen Ziels t1 haben.

Von dort subtrahieren wir einfach 1 zum Zeilenindex und erhalten unser endgültiges Ziel, t2. Sobald wir diese Zelle haben, können wir keine Informationen von ihm erhalten wir, wie der Wert eines Attributs (bgcolor) mögen oder den Inhalt, etc, etc.

<!doctype html> 
<html> 
<head> 
<script> 
window.addEventListener('load', onDocLoaded, false); 
function byId(id){return document.getElementById(id);} 
HTMLCollection.prototype.forEach = Array.prototype.forEach; 

function onDocLoaded(evt) 
{ 
    // 1. get id=current cell 
    var curCell = byId('current'); 

    // 2.get current row 
    var curRow = curCell.parentNode; 
    var table = curRow.parentNode.parentNode; // parentNode twice, since we're using both a table and a tbody element to wrap the rows. 

    // 3. get index of current row in table's 'rows' collection 
    var rowIndex = -1; 
    table.rows.forEach(function(elem, index, array){if (elem == curRow)rowIndex = index;}); 

    // 4. get index of current cell in table's current row's 'cells' collection 
    var cellIndex = -1; 
    table.rows[rowIndex].cells.forEach(function(elem, index, array){if (elem == curCell)cellIndex = index;}); 

    // 5. get data from the original target cell - the one below the one with an id of 'current' 
    alert(table.rows[rowIndex-1].cells[cellIndex].getAttribute('bgcolor')); 
    alert(table.rows[rowIndex-1].cells[cellIndex].textContent); 

} 
</script> 
</head> 
<body> 
    <table> 
     <tbody> 
      <tr> 
       <td></td> 
       <td bgcolor = "Brown">blah</td> 
       <td></td> 
      </tr> 

      <tr> 
       <td></td> 
       <td id="current"></td> 
       <td></td> 
      </tr>  
     </tbody> 
    </table> 
</body> 
</html> 
0

Finden Sie die am nächsten Reihe und dann vorherige Reihe finden und dann alle Zellen erhalten und Ihre gewünschte Eigenschaft durch jede Schleife

finden
 $(document).ready(function() {    
     $("#current").closest("tr").prev().find("td").each(function (a, b) { 

      if(String(b["bgColor"]).trim()=="Brown") 
      { 
       //here is cell which has brown bgcolor 
       alert("brown"); 
      } 
     }); 
    }); 
0

Sie sollten jquery in immer die Hintergrundfarbe von verwenden dieses Objekt.

wie folgt aus:

var color=$("#tdwithbgcolor").css("background-color"); 
$("#tdtosetcolor").css("background-color",color);