记住为下次访问选择的值

Question

我有一个这样的下拉菜单。

<select id='test'>
  <option value='one'>One</option>
  <option value='two'>Two</option>
  <option value='three'>Three</option>
 </select>

如何在第二次自动显示所选值？ 第一次它允许用户从下拉菜单中选择 select 项目。 但在第二次它应该显示之前选择的值。 我怎样才能做到这一点？

Answer 1

您将需要设置选定的属性。

#mickjguy

Answer 2

将选项值存储在数组中。 检查test的值是否为$_POST 。 创建选择元素。 迭代每个数组值以生成<option> ，检查$val是否与$_POST['test']值相同。 如果是，则echo 'selected' 。 使用ucfirst将首字母大写。

$vals = array('one', 'two', 'three');
$selected = isset($_POST['test']) ? $_POST['test'] : false;

echo '<select id="test" name="test">';

foreach($vals as $val):
    echo '<option value="',$val,'" ', ($selected == $val) ? 'selected':'','>', ucfirst($val) ,'</option>';
endforeach;

echo '</select>';

Answer 3

您的问题涉及面很广，因此，我将为您提供一些简短的选择：

饼干

届会

在php中，您可以将用户数据保存在文件中，该文件与会话cookie中保存的ID关联。 PHP为您完成了所有工作，您需要做的就是使用$_SESSION变量。
使其形式为： form.php

<?php include "load.php";?>
<form action="save.php">
 <select id='test' name="select" method="post">
  <option value='one' 
       <?php if($_SESSION["sel"]=="one") echo "selected=\"selected\"";?>
  >One</option>
  <option value='two' <?php if(...=="two") echo ...;?>>Two</option>
  <option value='three' <?php ...?>>Three</option>
 </select>
</form>

现在，最初，甚至没有定义$_SESSION ，因此我们必须从会话中加载数据：

load.php

<?php
/**NO TEXT OUTPUT ABOVE THIS LINE!!!**/
session_start();
if(!isset($_SESSION["sel"]))
   $_SESSION["sel"] = null;
?>

这是表单提交的地方：

save.php

<?php
/**NO TEXT OUTPUT ABOVE THIS LINE!!!**/
session_start();
$_SESSION["sel"] = $_POST["select"];
?>

只是饼干

仅使用cookie允许用户随时更改数据。 有时候这对于方便用户可能很有用（但是如果您不小心的话，对黑客来说也很不幸）。
PHP会使用存储在用户浏览器中的所有cookie自动生成$_COOKIE数组。 （更好地说：用户已发送）
我将不再制作3个文件示例，只是看看如何创建和删除cookie。 同样，设置cookie时，在setcookie调用之前必须没有输出。

//Get a cookie
if($_COOKIE["sel"] == "two") {
    ... do something ...
}

//Set a cookie:
setcookie ("sel", $_POST["select"], time()+3600*24*7);  //Expires in 7 days

//Delete a cookie
setcookie ("sel", "", 0);  //Expired in 20th century

本地存储

此解决方案不会让您的服务器知道用户的设置。 它可能与旧版浏览器不兼容。
本地存储将信息保存在用户的HDD上，而无需通知远程服务器。 这是一个记住其所选值的菜单：

<select id='test' onchange="remember(this.selectedIndex);">
  <option disabled="disabled" selected="selected">Select something</option>
  <option value='one'>One</option>
  <option value='two'>Two</option>
  <option value='three'>Three</option>
</select>
<script type="text/javascript">
if(localStorage!=null) {
  if(localStorage["sel"]!=null) {
    document.getElementById("test").selectedIndex = localStorage["sel"];
  }
}
//alert("d");
function remember(index) {
  if(localStorage!=null) {
    localStorage["sel"] = index;
  }
}
</script>

Answer 4

重申我的回答，我看不到“下次访问”部分。

假设您正在处理用户帐户，执行此操作的最佳方法是仅将所选选项存储在数据库中，一旦用户登录，便可以根据用户名拉出所选选项。

用户->选定的选项->存储在数据库中

用户登录->呼叫表单->从数据库中提取的选定选项

如果您不处理用户帐户，则必须设置一个cookie来记住该人及其下次访问时的选择。

参见： http : //www.tutorialspoint.com/php/php_cookies.htm

Answer 5

这个 Typescript 将存储任何 select 框标记为 class 到本地存储。

IE

<select class='remember'>
  <option value='one'>One</option>
  <option value='two'>Two</option>
  <option value='three'>Three</option>
</select>

document.querySelectorAll('select.remember').forEach((elem) => {
    if(elem instanceof HTMLSelectElement) {
        // Restore from local storage
        const selectedIndex = localStorage.getItem(elem.name)
        if(selectedIndex) {
            elem.selectedIndex = parseInt(selectedIndex)
        }
        // Add a click handler
        elem.addEventListener("change", () => {
            localStorage.setItem(elem.name, '' + elem.selectedIndex)
        })
    }
})