如何设置HTML中<option>默认选中并展示值（避免无限刷新）

首先咱们拆解下你遇到的两个核心问题：

• 无限刷新循环：每次表单提交后页面会重新加载，onload事件又会再次触发提交，形成了死循环；
• PHP拿不到值：你的select标签name是stringSelect，但PHP里用了$_POST["string"]，变量名不匹配，自然拿不到数据。

下面给你两种可行的解决方案，按需选择：

方案一：PHP后端控制提交逻辑（无JS依赖，兼容性好） #

这种方式通过PHP判断页面是否是首次加载，只有在没有POST数据时才触发自动提交，从根源上避免循环。

完整代码 #

<?php 
if (isset($_POST["foo"])) { 
    // 修正变量名，和select的name对应
    $vString = $_POST["stringSelect"]; 
    echo $vString; 
} else {
    // 首次加载时先默认展示选中值（可选，避免提交前的空白）
    echo 'one string';
}
?>

<html>
<!-- 只有首次加载（无POST数据）时才添加onload提交事件 -->
<body <?php if (!isset($_POST["foo"])) echo 'onload="document.stringForm.submit();"' ?>>
<form method="post" name="stringForm" id="stringForm">
    <select name="stringSelect">
        <!-- 设置默认选中的选项 -->
        <option selected>one string</option>
        <option>two string</option>
        <option>three string</option>
    </select>
    <input type="submit" name="foo">
</form>
</body>
</html>

方案二：JavaScript会话标记（纯前端逻辑） #

用sessionStorage标记页面是否已经提交过，首次加载时提交一次，之后刷新不再触发。

完整代码 #

<?php 
if (isset($_POST["foo"])) { 
    $vString = $_POST["stringSelect"]; 
    echo $vString; 
}
?>

<html>
<body onload="submitOnFirstLoad()">
<form method="post" name="stringForm" id="stringForm">
    <select name="stringSelect">
        <option selected>one string</option>
        <option>two string</option>
        <option>three string</option>
    </select>
    <input type="submit" name="foo">
</form>
<script>
function submitOnFirstLoad() {
    // 检查会话中是否有提交标记
    if (!sessionStorage.getItem('hasSubmitted')) {
        document.stringForm.submit();
        // 添加标记，会话内不再重复提交
        sessionStorage.setItem('hasSubmitted', 'true');
    }
}
</script>
</body>
</html>

关键说明 #

• 两种方案都给select设置了selected属性，保证页面加载时视觉上默认选中目标选项；
• 方案一不依赖JavaScript，对禁用JS的用户也友好；方案二更灵活，不需要后端配合，但依赖浏览器的sessionStorage支持（现代浏览器都没问题）；
• 记得始终保持表单元素的name和PHP中$_POST的键名一致，不然会出现拿不到数据的情况。

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