本地运行中解锁删除功能无效逻辑性不完善给出优化内容在优化代码html代码：!DOCTYPE htmlhtmlhead title网址收藏夹title meta charset=UTF-8 link rel=stylesheet href=stylecss script src=httpscodejquerycomjquery-360minjsscript script src=scriptjssc
<p>优化内容：</p>
<ol>
<li>添加网址时应该先检查输入是否为空，再检查是否已存在，最后再检查格式是否正确，提示信息也应更加明确。</li>
<li>删除、锁定、解锁功能需要在没有选中任何网址时提示用户选择要操作的网址。</li>
<li>解锁功能的实现逻辑有误，应该首先判断选中的网址是否已被锁定，然后再替换掉"locked:"前缀。</li>
<li>搜索功能应该忽略大小写，同时应该支持模糊匹配。</li>
<li>对话框关闭按钮点击事件应该使用事件委托，避免重复代码。</li>
</ol>
<p>优化后的代码如下：</p>
<p>html代码：</p>
<!DOCTYPE html>
<html>
<head>
<title>网址收藏夹</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<h1>网址收藏夹</h1>
<div class="toolbar">
<button id="add-btn">添加</button>
<button id="delete-btn">删除</button>
<button id="lock-btn">锁定</button>
<button id="unlock-btn">解锁</button>
<input type="text" id="search-input" placeholder="搜索">
</div>
<table id="url-table">
<thead>
<tr>
<th></th>
<th>网址</th>
<th>状态</th>
</tr>
</thead>
<tbody>
<?php
// 读取已保存的网址
$url_file = 'urls.txt';
if (file_exists($url_file)) {
$urls = file($url_file, FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
} else {
$urls = array();
}
<pre><code> // 输出网址表格
foreach ($urls as $index => $url) {
$locked = strpos($url, 'locked:') === 0;
$url = $locked ? substr($url, 7) : $url;
echo '<tr>';
echo '<td><input type="checkbox" name="url-checkbox" value="' . $index . '" ' . ($locked ? 'disabled' : '') . '></td>';
echo '<td><a href="' . $url . '" target="_blank">' . $url . '</a></td>';
echo '<td>' . ($locked ? '锁定' : '正常') . '</td>';
echo '</tr>';
}
?>
</tbody>
</table>
<div id="add-dialog" class="dialog">
<h2>添加网址</h2>
<form>
<label>网址：</label>
<input type="text" name="url-input" required>
<button type="submit">添加</button>
<button type="button" class="close-btn">取消</button>
</form>
</div>
<div id="delete-dialog" class="dialog">
<h2>删除网址</h2>
<form>
<p>确认删除选中的网址吗？</p>
<button type="submit">删除</button>
<button type="button" class="close-btn">取消</button>
</form>
</div>
<div id="lock-dialog" class="dialog">
<h2>锁定网址</h2>
<form>
<p>确认锁定选中的网址吗？</p>
<button type="submit">锁定</button>
<button type="button" class="close-btn">取消</button>
</form>
</div>
<div id="unlock-dialog" class="dialog">
<h2>解锁网址</h2>
<form>
<p>确认解锁选中的网址吗？</p>
<button type="submit">解锁</button>
<button type="button" class="close-btn">取消</button>
</form>
</div>
</code></pre>
</body>
</html>
<p>php代码：</p>
<?php
// 读取已保存的网址
$url_file = 'urls.txt';
if (file_exists($url_file)) {
$urls = file($url_file, FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
} else {
$urls = array();
}
// 添加新网址
if (isset($_POST['action']) && $_POST['action'] === 'add' && isset($_POST['url'])) {
$newUrl = $_POST['url'];
if ($newUrl === '') {
echo 'url cannot be empty';
} else if (in_array($newUrl, $urls)) {
echo 'url already exists';
} else if (!filter_var($newUrl, FILTER_VALIDATE_URL)) {
echo 'invalid url';
} else {
$urls[] = $newUrl;
file_put_contents($url_file, implode("\n", $urls));
echo 'success';
}
}
// 删除网址
if (isset($_POST['action']) && $_POST['action'] === 'delete' && isset($_POST['urls'])) {
$selected = $_POST['urls'];
if (count($selected) === 0) {
echo 'no url selected';
} else {
foreach ($selected as $index) {
if (array_key_exists($index, $urls)) {
unset($urls[$index]);
}
}
file_put_contents($url_file, implode("\n", $urls));
echo 'success';
}
}
// 锁定网址
if (isset($_POST['action']) && $_POST['action'] === 'lock' && isset($_POST['urls'])) {
$selected = $_POST['urls'];
if (count($selected) === 0) {
echo 'no url selected';
} else {
foreach ($selected as $index) {
if (array_key_exists($index, $urls)) {
if (strpos($urls[$index], 'locked:') === 0) {
continue; // 已被锁定，跳过
}
$urls[$index] = 'locked:' . $urls[$index];
}
}
file_put_contents($url_file, implode("\n", $urls));
echo 'success';
}
}
// 解锁网址
if (isset($_POST['action']) && $_POST['action'] === 'unlock' && isset($_POST['urls'])) {
$selected = $_POST['urls'];
if (count($selected) === 0) {
echo 'no url selected';
} else {
foreach ($selected as $index) {
if (array_key_exists($index, $urls)) {
if (strpos($urls[$index], 'locked:') !== 0) {
continue; // 未被锁定，跳过
}
$urls[$index] = substr($urls[$index], 7);
}
}
file_put_contents($url_file, implode("\n", $urls));
echo 'success';
}
}
?>
<p>JQ代码
$(document).ready(function() {
// 监听添加按钮点击事件
$('#add-btn').click(function() {
$('#add-dialog').show();
});</p>
<pre><code>// 监听删除按钮点击事件
$('#delete-btn').click(function() {
var checked = $('input[name="url-checkbox"]:checked');
if (checked.length > 0) {
$('#delete-dialog').show();
} else {
alert('请选择要删除的网址');
}
});
// 监听锁定按钮点击事件
$('#lock-btn').click(function() {
var checked = $('input[name="url-checkbox"]:checked');
if (checked.length > 0) {
$('#lock-dialog').show();
} else {
alert('请选择要锁定的网址');
}
});
// 监听解锁按钮点击事件
$('#unlock-btn').click(function() {
var checked = $('input[name="url-checkbox"]:checked');
if (checked.length > 0) {
$('#unlock-dialog').show();
} else {
alert('请选择要解锁的网址');
}
});
// 监听搜索框输入事件
$('#search-input').on('input', function() {
var keyword = $(this).val().trim().toLowerCase();
if
</code></pre>
原文地址: https://www.cveoy.top/t/topic/bmUv 著作权归作者所有。请勿转载和采集!