IE Javascript Cliccando Problema

Question

Prima di tutto, sto lavorando su un app che è scritto che alcuni tipici strumenti di debug non può essere utilizzato (o almeno io non riesco a capire come si fa :).

JavaScript, html, ecc sono tutti "cotti" e codificati (penso;Io sono un po ' confuso su come funziona il processo) prima di essere distribuito, quindi non posso allegare VS 2005 a ie, e firebug lite non funziona bene.Inoltre, l'interfaccia è in fotogrammi (che schifo), quindi, alcuni altri strumenti che non funzionano bene.

Firebug funziona alla grande in Firefox, che non hanno questo problema (né Safari), così sto sperando che qualcuno potrebbe vedere qualcosa di "ovviamente" di sbagliato con il modo in cui il mio codice giocare con IE.C'è di più informazioni che possono essere fornite circa la sua eccentricità, ma cominciamo con questo.

Fondamentalmente, ho una funzione che "crolla" tabelle nel loro intestazioni normale righe della tabella non è visibile.Ho "onclick='toggleDisplay("theTableElement", "theCollapseImageElement")'" nel <tr> i tag e le tabelle che iniziano con "class='chiuso'".

Singolo clic comprimere ed espandere tabelle in FF & Safari, ma IE tabelle richiedono più click (apparentemente arbitrario numero tra 1 e 5) per espandere.A volte, dopo aver inizialmente sempre "aperto", le tabelle di espandere e comprimere con un singolo clic del mouse per un po', poi tornare a posto più clic.Posso dire da quel poco che posso vedere in Visual Studio che la funzione è effettivamente raggiunto ogni volta.Grazie in anticipo per qualsiasi consiglio!

Ecco il codice JS:

bURL_RM_RID="some image prefix";
CLOSED_TBL="closed";
OPEN_TBL="open";
CLOSED_IMG= bURL_RM_RID+'166';
OPENED_IMG= bURL_RM_RID+'167';

//collapses/expands tbl (a table) and swaps out the image tblimg
function toggleDisplay(tbl, tblimg) {
    var rowVisible;
    var tblclass = tbl.getAttribute("class");
    var tblRows = tbl.rows;
    var img = tblimg;

    //Are we expanding or collapsing the table?
    if (tblclass == CLOSED_TBL) rowVisible = false;
    else rowVisible = true;

    for (i = 0; i < tblRows.length; i++) {
        if (tblRows[i].className != "headerRow") {
            tblRows[i].style.display = (rowVisible) ? "none" : "";
        }
    }

    //set the collapse images to the correct state and swap the class name
    rowVisible = !rowVisible;
    if (rowVisible) {
        img.setAttribute("src", CLOSED_IMG);
        tbl.setAttribute("class",OPEN_TBL);     
    }
    else {
        img.setAttribute("src", OPENED_IMG);
        tbl.setAttribute("class",CLOSED_TBL);
    }
}

­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­

Answer 1

setAttribute non è affidabile in IE. Tratta l'accesso agli attributi e l'accesso alla proprietà dell'oggetto come la stessa cosa, quindi poiché la proprietà DOM per l'attributo 'class' si chiama 'className', dovresti usarlo invece su IE.

Questo errore è stato corretto nella nuova versione beta di IE8, ma è più semplice utilizzare direttamente la proprietà HTML di livello 1 DOM:

img.src= CLOSED_IMAGE;
tbl.className= OPEN_TBL;

Puoi anche piegare la tabella nel foglio di stile, che sarà più veloce e ti risparmierà il fastidio di dover scorrere le righe della tabella nello script:

table.closed tr { display: none; }

Answer 2

Hai provato a cambiare questa linea

tblRows[i].style.display = (rowVisible) ? "none" : "";

a qualcosa di simile

tblRows[i].style.display = (rowVisible) ? "none" : "table-row";

o

tblRows[i].style.display = (rowVisible) ? "none" : "auto";

Answer 3

Potresti voler effettuare la chiamata onclick sul tag <tr> effettivo anziché sui singoli tag <th>. In questo modo hai meno JS nel tuo HTML che lo renderà più gestibile.

Answer 4

Se si abilita il debug di script in internet explorer (Strumenti->Opzioni Internet->Avanzate) e mettere un 'debugger;' istruzione nel codice, vale a dire visualizzerà automaticamente Visual Studio quando colpisce il debugger di istruzione.

Answer 5

Ho avuto problemi con questo in IE. Se ricordo bene, dovevo mettere un valore iniziale per & Quot; display & Quot; stile, direttamente sull'HTML così come è stato inizialmente generato. Ad esempio:

<table>
  <tr style="display:none"> ... </tr>
  <tr style="display:"> ... </tr>
</table>

Quindi potrei usare JavaScript per cambiare lo stile, nel modo in cui lo stai facendo.

Answer 6

Uso sempre style.display = " blocco " e style.display = " nessuno "