如何使用PHP echo为select输入框设置GET参数对应的选中值

问题原因 #

1. HTML 中 <select> 标签本身没有原生的value属性，你直接在标签上写value是无效的，选中状态需要给对应值的<option>标签加selected属性才能生效，另外你现有代码的value属性还存在缺少等号的语法错误，即便规范支持也无法正常读取值。
2. 你直接执行 jQuery 的val()赋值不生效，大概率是赋值时categories_list类还没完成选项加载，DOM 中不存在对应值的option，赋值自然不生效，和是否绑定点击事件无关。

解决方案 #

方案1：PHP 渲染阶段直接设置选中（适用于分类选项是PHP同步渲染的场景） #

在categories_list类渲染<option>标签的逻辑中，增加GET参数判断，匹配到对应分类时输出selected属性即可。
示例代码：

<div class="control-group">
    <label class="control-label alignL" for="categories_id">Catégories </label>
    <select id="categories_id" class="form-control common_selector categories_list" name="categories_id">
        <?php
        // 以下为categories_list类输出option的逻辑示例，替换成你实际的渲染代码即可
        $categoryList = (new categories_list())->getList();
        $defaultCat = isset($_GET['cat']) ? trim($_GET['cat']) : '';
        foreach ($categoryList as $item) {
            $selected = ($item['category_id'] == $defaultCat) ? 'selected' : '';
            echo "<option value='{$item['category_id']}' {$selected}>{$item['category_value']}</option>";
        }
        ?>
    </select>   
</div>

方案2：JS 等待选项加载完成后赋值（适用于分类选项是前端异步加载的场景） #

不需要绑定点击事件，只要在分类选项异步加载、渲染完成的回调逻辑中执行赋值即可。
示例代码：

// 假设这是你原有categories_list类加载分类的异步逻辑
$.ajax({
    url: '/api/get_categories',
    type: 'GET',
    success: function (res) {
        // 原有渲染option的逻辑
        // ...
        // 渲染完成后增加以下赋值逻辑
        const query = new URLSearchParams(window.location.search);
        if (query.has('cat')) {
            $('#categories_id').val(query.get('cat'));
        }
    }
})

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