如何简化jQuery代码避免重复逻辑？新手技术求助

常见语法错误排查 #

你遇到的Uncaught SyntaxError: Unexpected token ';'通常是以下几种情况导致：

• 函数定义时多写了分号（比如function checkTooltip(); { ... }）
• 函数内部语句的括号/引号未闭合
• jQuery选择器的字符串拼接逻辑错误（比如漏写引号或加号）

正确封装实现 #

以下是适配你需求的封装代码，直接复用页面加载和下拉框变更的逻辑：

// 封装检查并显示对应tooltip的函数
function checkTooltip() {
    // 先隐藏所有tooltip元素
    $('.tooltip').hide();
    // 获取下拉框当前选中值
    const selectedVal = $('#your-select-id').val();
    // 显示对应类名的tooltip（数字类名兼容处理）
    $(`.${selectedVal}`).show();
    // 若数字类名识别有问题，改用属性选择器：$('div[class~="' + selectedVal + '"]').show();
}

// 页面加载完成后执行一次，避免刷新后提示框消失
$(document).ready(function() {
    checkTooltip();
});

// 下拉框值变化时触发检查
$('#your-select-id').on('change', function() {
    checkTooltip();
});

补充说明 #

1. 替换代码中的#your-select-id为你实际的下拉框ID
2. 如果你的tooltip元素同时有通用类名（比如.tooltip）和数字类名，选择器可改为$('.tooltip.' + selectedVal)
3. 数字开头的类名在HTML中合法，但部分场景下直接用.$数字可能有识别问题，此时用属性选择器div[class~="数字"]更稳妥

内容的提问来源于stack exchange，提问作者Hysteria