如果这里的选择栏目不给界定好，而是使用帝国cms的[!--class--]即所有栏目自动显示，
然后就像新闻栏目自动切换到tempid=1和tbname=news，
其它的也自动切换到对应的数据表和搜索模板id，应该如何再进一步修改？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>帝国CMS搜索栏</title>
<style>
.search-form {
display: flex;
align-items: center;
gap: 8px;
padding: 10px;
background: #f5f5f5;
border-radius: 6px;
max-width: 600px;
margin: 0 auto;
}
.search-input {
flex: 1;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
background: white;
min-width: 200px;
}
.search-select {
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
min-width: 150px;
background: white;
}
.search-btn {
padding: 8px 16px;
background: #007cba;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
white-space: nowrap;
}
.search-btn:hover {
background: #005a87;
}
.status-info {
margin-top: 10px;
padding: 8px;
background: #f0f8ff;
border-radius: 4px;
font-size: 12px;
color: #666;
text-align: center;
}
.highlight {
color: #007cba;
font-weight: bold;
}
</style>
</head>
<body>
<form onsubmit="return checkSearchForm()" method="post" name="searchform" action="/e/search/index.php">
<input type="text" name="keyboard" placeholder="输入关键词搜索...">
<select name="classid" id="classSelect" onchange="updateSearchParams()">
<option value="" disabled selected>选择栏目</option>
<!-- 这里使用帝国CMS的[!--class--]标签动态生成栏目列表 -->
<!-- 实际使用时需要替换为帝国CMS的栏目循环代码 -->
</select>
<button type="submit">搜索</button>
<input type="hidden" value="title" name="show">
<input type="hidden" value="1" id="tempidField" name="tempid">
<input type="hidden" value="news" id="tbnameField" name="tbname">
<input name="mid" value="1" type="hidden">
<input name="dopost" value="search" type="hidden">
</form>
<div>
当前设置: 模板ID = <span id="currentTempid">1</span> | 数据表 = <span id="currentTbname">news</span>
</div>
<script>
// 栏目配置数据 - 这里模拟帝国CMS的栏目结构
const classConfig = {
'1': { tempid: '1', tbname: 'news', name: '新闻栏目' },
'2': { tempid: '4', tbname: 'download', name: '下载栏目' },
'3': { tempid: '2', tbname: 'photo', name: '图片栏目' },
'4': { tempid: '3', tbname: 'product', name: '产品栏目' },
'5': { tempid: '5', tbname: 'video', name: '视频栏目' }
};
// 初始化栏目选择框
function initClassSelect() {
const classSelect = document.getElementById('classSelect');
// 清空现有选项（除了第一个提示选项）
while (classSelect.children.length > 1) {
classSelect.removeChild(classSelect.lastChild);
}
// 动态添加栏目选项
for (const classid in classConfig) {
const option = document.createElement('option');
option.value = classid;
option.textContent = classConfig[classid].name;
classSelect.appendChild(option);
}
}
// 根据选择的栏目更新搜索参数
function updateSearchParams() {
const classSelect = document.getElementById('classSelect');
const selectedClassId = classSelect.value;
const tempidField = document.getElementById('tempidField');
const tbnameField = document.getElementById('tbnameField');
const currentTempid = document.getElementById('currentTempid');
const currentTbname = document.getElementById('currentTbname');
if (selectedClassId && classConfig[selectedClassId]) {
const config = classConfig[selectedClassId];
tempidField.value = config.tempid;
tbnameField.value = config.tbname;
currentTempid.textContent = config.tempid;
currentTbname.textContent = config.tbname;
}
}
// 表单验证
function checkSearchForm() {
const keyword = document.querySelector('.search-input').value.trim();
const classid = document.getElementById('classSelect').value;
if (!keyword) {
alert('请输入搜索关键词！');
return false;
}
if (!classid) {
alert('请选择搜索栏目！');
return false;
}
// 显示搜索信息
const config = classConfig[classid];
console.log(`正在搜索栏目: ${config.name}, 关键词: ${keyword}, 模板ID: ${config.tempid}, 数据表: ${config.tbname}`);
return true;
}
// 页面加载时初始化
document.addEventListener('DOMContentLoaded', function() {
initClassSelect();
updateSearchParams();
});
</script>
</body>
</html>