2016-04-27 7 views
2

Highlight ist keine Funktion im Webbrowser. Was ist das Problem dieser Codes? Im Grunde möchte ich etwas tun, das die Tabellenzeile markiert und dann den Wert der Tabellenzeile auf eine andere PHP-Seite schreibt.Wählen Sie eine Zeile (Hervorhebung) aus HTML-Tabelle und senden Sie Werte auf einen Knopf

test.html

<html> 
<head> 
<link href="test.css" rel="stylesheet" type="text/css" /> 
<script src="test.js" type="text/javascript"></script> 
</head> 
<body> 
<table id="table"> 
    <tr> 
     <td>1 Ferrari F138</td> 
     <td>1 000€</td> 
     <td>1 200€</td> 
     <td>Model monopostu stajne Scuderia Ferrari pre sezónu 2013</td> 
     <td>1</td> 
     <td>F138</td> 
     <td>Klik pre detaily</td> 
    </tr> 
    <tr> 
     <td>2 Ferrari F138</td> 
     <td>1 000€</td> 
     <td>1 200€</td> 
     <td>Model monopostu stajne Scuderia Ferrari pre sezónu 2013</td> 
     <td>1</td> 
     <td>F138</td> 
     <td>Klik pre detaily</td> 
    </tr> 
    <tr> 
     <td>3 Ferrari F138</td> 
     <td>1 000€</td> 
     <td>1 200€</td> 
     <td>Model monopostu stajne Scuderia Ferrari pre sezónu 2013</td> 
     <td>1</td> 
     <td>F138</td> 
     <td>Klik pre detaily</td> 
    </tr> 
</table> 

    <input type="button" id="tst" value="OK" onclick="fnselect()" /> 
</body> 
</html> 

test.js

function highlight(e) { 
    if (selected[0]) selected[0].className = ''; 
    e.target.parentNode.className = 'selected'; 

} 

var table = document.getElementById('table'), 
    selected = table.getElementsByClassName('selected'); 
table.onclick = highlight; 

function fnselect(){ 
var $row=$(this).parent().find('td'); 
    var clickeedID=$row.eq(0).text(); 
    // alert(clickeedID); 
} 

$("#tst").click(function(){ 
    var value =$(".selected td:first").html(); 
    value = value || "No row Selected"; 
    alert(value); 
}); 

Test. css

td {border: 1px #DDD solid; padding: 5px; cursor: pointer;} 

.selected { 
    background-color: brown; 
    color: #FFF; 
} 
+0

http://stackoverflow.com/questions/24750623/select-a-row-from-html-table-and-send-values-onclick-of-a-button Sie können diese Frage prüfen –

+0

Yup, ich hatte überprüft, aber die Highlight-Funktion ist nicht ausführen, ich weiß nicht, was ist der Fehler Fehler von diesem Code. –

+0

Scheint gut zu funktionieren, nachdem Sie Ihren Code einfach in jsfiddle eingefügt haben. Möglicherweise fügen Sie den CSS-Pfad nicht richtig ein oder erhalten möglicherweise einen anderen Fehler. – TomDillinger

Antwort

1

Sie brauchen nicht fnselect() Funktion

ändern Ihre js als:

window.onload = function() { 
    function highlight(e) { 
     if (selected[0]) selected[0].className = ''; 
     e.target.parentNode.className = 'selected';  
    }  
    var table = document.getElementById('table'), 
     selected = table.getElementsByClassName('selected'); 
    table.onclick = highlight; 

     $("#tst").click(function() { 
     var value = $(".selected td:first").html(); 
     value = value || "No row Selected"; 
     alert(value); 
    }); 
}; 

auch jquery in Ihrem HTML vor den anderen test.js in Kopf hinzu:

und schließlich machen Sie eine der Zeilen standardmäßig ausgewählt.

Verwandte Themen