Question

我想要一个表单重新加载并通过选择进行预选。这是我的HTML表单：

<form name='vehicleform'>

<select name='vehiclelist'>
  <option value=''>Select</option>
  <option value='bus'>Bus</option>
  <option value='bike'>Bike</option>
  <option value='car'>Car</option>
</select>

<input type='text' name='current'></input>

</form>

当用户首次打开该页面时，默认情况下，下拉框将位于选择选项上，文本框（当前）将为空。

当用户从下拉列表中选择任何选项时，页面需要重新加载，并且应该选择该下拉项目，并且该下拉列表的值应该在文本输入字段中。

我需要做些什么来实现这一功能？

Answer 1

像这样：

<select name='soemname' id="myid" onchange="document.location.href = 'page.php?var=' + this.value">
  <option value=''>Select</option>
  <option value='bus'>Bus</option>
  <option value='bike'>Bike</option>
  <option value='car'>Car</option>
</select>

<script type="text/javascript">
  document.getElementById('myid').value = "<?php echo $_GET['var'];?>";
</script>

Answer 2

sAc's answer告诉您如何使用onchange事件修改 location.href 属性。这将有效，但禁用JS的用户无法访问它。我会在表单的action属性中设置一个url，并让select元素在 onchange 事件中提交表单。这样，使用JavaScript的用户仍然可以按返回键重新加载页面，效果相同：

<?php $sel = isset($_GET['vehiclelist']) ? $_GET['vehiclelist'] : ""; ?>
<form name='vehicleform' action="thispage.php">

<select name='vehiclelist' onchange="this.parentNode.submit();">
  <option value='' >Select</option>
  <option value='bus' <?php echo $sel == "bus" ? "selected" : "";?>>Bus</option>
  <option value='bike' <?php echo $sel == "bike" ? "selected" : "";?>>Bike</option>
  <option value='car' <?php echo $sel == "car" ? "selected" : "";?>>Car</option>
</select>

<input type='text' name='current' value="<?php echo htmlspecialchars($_GET['var']); ?>"></input>

</form>

最终结果是禁用了JavaScript的用户也可以访问该功能。

使用JavaScript下拉更改事件触发的参数重新加载页面

2 个答案: