Имеется файл с данными tst.log, которые мы можем отметить и удалить с помощью кнопки "Удалить лишнее".
Далее, обновленный файл нужно перезаписать кнопкой "Сохранить изменения" ... т.к после обновления страницы все изменения сбрасываются...
<style>
.table td {
border: 1px solid #757575;
text-align: center;
vertical-align: middle;
position: relative;
cursor: pointer;
}
.table .active td:after {
content: '';
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
background:red; opacity:0.5;
border: 3px solid red;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.0.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.table tr').hover(function() {
$(this).addClass('hover');
}, function() {
$(this).removeClass('hover');
});
$('.table tr').click(function() {
$('.table tr').removeClass('active');
$(this).addClass('active');
element_tr = $(this);
});
});
$(document).ready(function() {
$("#btnDelete").on('click', function() {
element_tr.remove();
});
});</script>
<?php
if (isset($_GET[col])) { $col=$_GET[col]; } else { $col=20; }
$file=file("tst.log"); ?>
<html>
<head>
<style type='text/css'>
td.zz {PADDING-LEFT: 3px; FONT-SIZE: 9pt; PADDING-TOP: 2px; FONT-FAMILY: Arial; COLOR: Black;}
</style>
</head>
<body>
<center>
<?php
if ($col>sizeof($file)) { $col=sizeof($file); }
echo "Последние <b>".$col."</b> записей:";
echo "<br><button id='btnDelete'>Удалить лишнее</button>";
?>
<table id="myTable" class="table" width="auto" cellspacing="1" cellpadding="1" border="0" STYLE="table-layout:fixed">
<?php
for ($si=sizeof($file)-1; $si+1>sizeof($file)-$col; $si--) {
$string=explode("|",$file[$si]);
$q1[$si]=$string[0]; // столбец
echo '<tr bgcolor="#B0E0E6"><td class="zz">'.$q1[$si].'</td>';
}
?>
</table></center></body></html>
Содержимое файла tst.log
строка A
строка B
строка C
строка D
строка E
строка F
строка G
строка K
строка L
строка M
