表格行的Javascript比较以红色突出显示一行（CakePHP）

Question

如何找到正确的方法来进行这种比较？我尝试了各种方法。我什至使用了 id，但他们没有回应。如果我做这个“gumboots”字符串检查，它确实有效。 “gumboots”只是表中某处存在的产品名称的值。这就是我知道我根本不需要 PHP 的原因，尽管在下面的索引视图中的 PHP 中显示了表格。任何想法？我会很感激的。

这里是javascript

$('#example tbody tr td').each(function() 
{
                //var p_no_in_stock = parseInt($('#p_no_in_stock')).val();
                 //var p_reorder_quantity = parseInt($('#p_reorder_quantity')).val();
                 var p_no_in_stock = parseInt(document.getElementById('p_no_in_stock')).value;
                 var p_reorder_quantity = parseInt(document.getElementById('p_reorder_quantity')).value;


//if ($product['Product']['p_no_in_stock'].val() < $product['Product']['p_reorder_quantity'].val())
if ($(this).text() == "gumboots") 
//if ($(this).p_no_in_stock < $(this).p_reorder_quantity)
{
//$("#row_" +" td").effect("highlight", {}, 1500);
$(this).closest('tr').attr('style','background-color:red');
$(this).parent().css('background-color','red');
$(this).parent().attr('style','background-color:red');
$(this).parent().addClass('highlight');
$(this).parent().css('font-weight','bold');
} 

}); 

这是一个名为 Products.index 的视图中的应用程序

<div class="active">

        <h2><?php echo __('Products'); ?></h2>

        <table cellpadding="0" cellspacing="0" class="table table-striped table-bordered" id ="example">

            <tr>

                <th><?php echo $this->Paginator->sort('p_name', 'Name'); ?></th>
                <th><?php echo $this->Paginator->sort('category_name', 'Category'); ?></th>
                <th><?php echo $this->Paginator->sort('p_no_in_stock','No. in Stock'); ?></th>
                <th><?php echo $this->Paginator->sort('p_reorder_quantity', 'Re-order Quantity'); ?></th>
                <th class="actions"><?php echo __('Actions'); ?></th>
            </tr>
            <tbody>
            <?php foreach ($products as $product): ?>
                <tr>

                    <td><?php echo h($product['Product']['p_name']); ?></td>
                    <td> <?php echo $this->Html->link($product['Category']['category_name'], 
                    array('controller' => 'categories', 'action' => 'view', $product['Category']['id'])); ?>
                    </td>      
                    <td id = "p_no_in_stock" type ="number" ><?php echo h($product['Product']['p_no_in_stock']); ?>&nbsp;</td>
                    <td id ="p_reorder_quantity" type ="number" ><?php echo h($product['Product']['p_reorder_quantity']); ?>&nbsp;</td>
                    <td class="actions">
                        <?php echo $this->Html->link(__('View'), array('action' => 'view', $product['Product']['id']), array('class' => 'btn btn-mini')); ?>
                        <?php echo $this->Html->link(__('Edit'), array('action' => 'edit', $product['Product']['id']), array('class' => 'btn btn-mini')); ?>
                        <?php echo $this->Form->postLink(__('Delete'), array('action' => 'delete', $product['Product']['id']), array('class' => 'btn btn-mini'), __('Are you sure you want to delete # %s?', $product['Product']['id'])); ?>
                    </td>
                </tr>
            <?php endforeach; ?>
                </tbody>
        </table>

提前致谢。

Answer 1

这是您要问的吗？

http://jsfiddle.net/SinisterSystems/z9SE7/1/

HTML：

<table>
    <tr>
        <td>Test</td>
        <td>Test</td>
        <td>Test</td>
        <td>Test</td>
        <td>Test</td>
    </tr>
    <tr>
        <td>Test</td>
        <td>Test</td>
        <td>Test</td>
        <td>Test</td>
        <td>Test</td>
    </tr>
</table>

CSS：

tr:hover td {
    background:#F00;
}

Answer 2

我正在向您发送我的代码，请相应地修改它.... PHP 代码为 -

<?php

if($num>0)
{

    echo '<table width="100%" id="dep_table"  style="margin-top:10px;"  cellspacing="1" cellpadding="2" border="0">';
    echo '<tr bgcolor="#4682B4">';
    echo '<th>Editor</th>';
    echo '<th>Department Id</th>';
    echo '<th>Department Name</th>';
    echo '</tr>';
    $i=0;


    while ($row = $stmt->fetch(PDO::FETCH_ASSOC))
    {
        $i++;
        if($i % 2 == 0) 
        {
            $bgcolor= "#6AA2C3";
        }
        else 
        {
         $bgcolor= "#A2B5CD";
        }
        //extract row, this will make $row['firstname'] to just $firstname only
        extract($row);

        //creating new table row per record
        echo "<tr bgcolor='$bgcolor' id='$DeptId' name='edit_tr'>";
    echo '<td id="edit"><input id="edit" type="radio" name="deptid" value="DeptId" ?></td>';

    echo "<td class='format'>{$row['DeptId']}</td>";
    echo "<td class='format'>{$row['DeptName']}</td>";
    echo "</tr>";
    }


    echo "</table>";
 }




 echo "</div>";

对应代码的JS为-

 $(document).ready(function() {

row_color();

$('#dep_table tr').click(function(e) {

     $(this).find('td input:radio').prop('checked', true);
    /*  submit_fxn(); 
        $('#form_ndesg').submit(function(e) {
            return false;
        });*/
  });


}); 

//******* 1 div 淡入/淡出效果 *******

function row_color(){
$('#dep_table tr').not(':first').hover(function(){
    $(this).addClass('hover');
},function(){
    $(this).removeClass('hover');
});

};

对应的CSS代码为-

tr.hover{
background-color:#E7ECB8;
color:#990000;
}

您将在表格上移动鼠标，它会更改行颜色以及 rwo 文本颜色，当您单击特定行时，它将通过选择单选按钮启用该行..

如果这个答案对你有帮助，请点赞作为答案，以便其他人可以参考。谢谢，祝你好运