javascript - 页面刷新后保留下拉列表的选定值

标签 javascript php jquery

点击页面刷新后,我需要保留下拉列表的选定值。

发生了什么:

从下拉列表中选择一个项目后,页面会自行重新加载,并且下拉列表的值会转到起始位置,尽管该值显示在网址末尾。

这是我的代码:

<script>
function refreshPage(passValue){
    window.location="index.php?cat_page=admin_post&sw_cat=sw_catn="+passValue;
}
</script>


<div class="form-group col-md-4">
    <label for="inputState">Your health proplem</label>
    <select name="illness_id_cat" class="form-control" onchange="refreshPage(this.value);" >
<?php 
while(mysqli_stmt_fetch($stmt)){
    echo "<option value='{$illness_id_cat}'>{$illness_name_cat}</option>";
}
?>
    </select>
</div>

此选项也不起作用:

<script>
var selectedItem = sessionStorage.getItem("SelectedItem");  
$('#dropdown').val(selectedItem);

$('#dropdown').change(function() { 
    var dropVal = $(this).val();
    sessionStorage.setItem("SelectedItem", dropVal);
});
</script>

<div class="form-group col-md-4">
    <label for="inputState">Your health proplem</label>
    <select name="illness_id_cat" class="form-control" id="dropdown" >
<?php 
while(mysqli_stmt_fetch($stmt)){
    echo "<option value='{$illness_id_cat}'>{$illness_name_cat}</option>";
}
?>
    </select>
</div>

这个我不知道如何实现,什么是“itemname”:

<script>
var text = localStorage.getItem("itemname");
if(text !== null) {
    $("select option").filter(function() {
        return this.text == text;
    }).attr('selected', true);
}
</script>

最佳答案

更传统的方法是使用 PHP,并通过 window.location 命令获取传入的查询字符串值:

<script>
function refreshPage(passValue){
    window.location="index.php?cat_page=admin_post&sw_cat="+passValue;
}
</script>


<div class="form-group col-md-4">
    <label for="inputState">Your health problem</label>
    <select name="illness_id_cat" class="form-control" onchange="refreshPage(this.value);" >
<?php 
while(mysqli_stmt_fetch($stmt)){
    echo "<option";
    //get the category value from the querystring and check it against the current category value in the loop. If it matches, pre-set the option as selected
    if (isset($_GET["sw_cat"])) {
      if ($_GET["sw_cat"] == $illness_id_cat) echo " selected";
    }
    echo " value='{$illness_id_cat}'>{$illness_name_cat}</option>";

}
?>
    </select>
</div>

关于javascript - 页面刷新后保留下拉列表的选定值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61104212/

相关文章:

javascript - 在函数中引用(this)

php - 获取文本文件的前 100 个字符和后 100 个字符

php - 获取一个字段中的所有行数据

jquery - 你能将 jQuery 选择器与(稍微更)高级的逻辑分组吗?

javascript - 功能组件从父组件接收数组并通过它进行映射

javascript - 具有多个参数的 Knockout JS 中的扩展器

使用 HTML 表格的 PHP 循环

javascript - 如何在事件发生的 div 外部获取数据属性 jQuery?

javascript - 从具有不同值的逗号分隔 JSON 对象填充 html 下拉列表

javascript - 当用户滚动时沿着曲线路径移动元素