Question

我做了以下表格。当我选择任何选项时，页面自动向上滚动。任何想法如何解决？

这是HTML代码：

 <form method="get" action="">
    <select id="training_session" name="lang" onchange=this.form.submit()>
    <option value=""<?php if($_GET['lang'] === '') echo 'selected' ?>>[All languages]</option>
    <option value="English" <?php if($_GET['lang'] === 'English') echo 'selected' ?>>English</option>
    <option value="Portuguese"<?php if($_GET['lang'] === 'Portuguese') echo 'selected' ?>>Portuguese</option>
    <option value="French"<?php if($_GET['lang'] === 'French') echo 'selected' ?>>French</option>
    <option value="Italian"<?php if($_GET['lang'] === 'Italian') echo 'selected' ?>>Italian</option>
    <option value="Japanese"<?php if($_GET['lang'] === 'Japanese') echo 'selected' ?>>Japanese</option>
    </form>
    <noscript><input type="hidden" value="filter"></noscript>

Answer 1

页面没有向上滚动。

onchange=this.form.submit()

表单正在提交，页面正在重新加载。

页面的新版本从顶部加载。

Answer 2

当您提交页面时，它会重新加载到顶部。

这是一种解决方法：

首先在提交前获取滚动位置，然后使用以下表单提交：

 <form method="get" action="">
    <select id="training_session" name="lang" onchange="document.getElementById('sc_top').value=document.body.scrollTop;this.form.submit()">
    <option value=""<?php if($_GET['lang'] === '') echo 'selected' ?>>[All languages]</option>
    <option value="English" <?php if($_GET['lang'] === 'English') echo 'selected' ?>>English</option>
    <option value="Portuguese"<?php if($_GET['lang'] === 'Portuguese') echo 'selected' ?>>Portuguese</option>
    <option value="French"<?php if($_GET['lang'] === 'French') echo 'selected' ?>>French</option>
    <option value="Italian"<?php if($_GET['lang'] === 'Italian') echo 'selected' ?>>Italian</option>
    <option value="Japanese"<?php if($_GET['lang'] === 'Japanese') echo 'selected' ?>>Japanese</option>
    </select>
    <input type='hidden' name='scrollTop' id='sc_top'/>
    </form>
    <noscript><input type="hidden" value="filter"></noscript>

然后编辑您的body标记，以便在加载页面时再次设置此位置：

<body onload="document.body.scrollTop = <?=intval($_GET['scrollTop']);?>">

为什么我提交表单时页面会向上滚动？

2 个答案: