Question

突出显示在网络浏览器中不起作用。这个代码有什么问题？基本上，我想做一些突出显示表行的事情，然后将表行的值发布到另一个php页面。

的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);
});

测试。 CSS

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

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

Answer 1

您不需要fnselect（）函数

将你的js修改为：

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);
    });
};

还要在你的html中添加jquery，然后在其他test.js中添加：

最后选择其中一行默认值。

从html表中选择一行（突出显示），然后单击按钮

1 个答案: