.NET 8 Razor Page搜索按钮浏览器前进后退后异常禁用问题求助

问题核心在于浏览器的后退前进缓存（BF Cache）：当用户通过前进/后退返回页面时，页面会从缓存中直接恢复，此时$(document).ready可能不会重新触发，或者触发时直接把按钮设为禁用，完全忽略了输入框中已保留的内容。

修复方案很简单，把按钮状态的判断逻辑抽成独立函数，同时增加对pageshow事件的监听，确保无论页面是首次加载还是从缓存恢复，都能正确检查输入框状态：

修改后的前端代码如下：

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Search Button Example</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        // 抽离独立的状态检查函数
        function updateSearchButtonState() {
            const inputValue = $('#searchInput').val();
            $('#searchButton').prop('disabled', inputValue.trim() === "");
        }

        $(document).ready(function () {
            // 初始化时直接检查状态
            updateSearchButtonState();
            
            // 输入框变化时更新状态
            $('#searchInput').on('input', updateSearchButtonState);
        });

        // 监听pageshow事件，处理浏览器缓存加载的情况
        $(window).on('pageshow', function() {
            updateSearchButtonState();
        });
    </script>
</head>

关键改动说明：

• 把原本写在input事件里的判断逻辑抽成updateSearchButtonState函数，避免重复代码
• 页面首次加载时，不再直接禁用按钮，而是调用函数根据输入框实际值设置状态
• 添加pageshow事件监听：当页面从缓存恢复时，这个事件会触发，此时再次执行状态检查，确保按钮状态和输入框内容匹配

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