选择时,选择返回原始状态的长方体


Select Box returning to original state when selecting?

在下面的表单中,我在url后面的选择框中有选项。但是,我想改为提交按钮,因为用户将输入用户名并选择下拉值。

        <section id="search">
            <form method="get" action="index.php" id="main-form">
                <div class="summoner_search">
                    <input id="summoner" name="summoner" type="text" placeholder="Summoner"/>
                    <input id="region" name="region" type="hidden" value="<?php echo $region ?>"/>
                    <input id="form" name="form" type="hidden" value="true"/>
                    <select id="regions" onchange="location = this.options[this.selectedIndex].value;">
                      <option value="index.php?region=br">BR</option>
                      <option value="index.php?region=eune">EUNE</option>
                      <option value="index.php?region=euw">EUW</option>
                      <option value="index.php?region=kr">KR</option>
                      <option value="index.php?region=lan">LAN</option>
                      <option value="index.php?region=las">LAS</option>
                      <option value="index.php?region=na">NA</option>
                      <option value="index.php?region=oce">OCE</option>
                      <option value="index.php?region=ru">RU</option>
                      <option value="index.php?region=tr">TR</option>
                    </select>
                    <input type="submit" value="Submit" style="display:none;"/>        
                </div>
                <a href="index.php" alt="reset">Reset Values</a>
            </form>
        </section>

目前,下拉列表会刷新页面,并且必须重新输入召唤师名称。如果我可以把它放在提交按钮上,这样值就会在提交后附加,我认为这应该更好,但我不知道如何做到这一点。

我的另一个附带问题是,有人能告诉我正确的方向,根据访问的国家自动加载下拉值吗?

谢谢Alex

如果您想避免在select的onchange事件触发后再次输入调用器值,那么您可以将调用器输入的值附加到onchange事件中调用的URL,类似于以下代码:

<section id="search">
    <form method="get" action="index.php" id="main-form">
        <div class="summoner_search">
            <input id="summoner" name="summoner" type="text" 
                   placeholder="Summoner"
                   value="<?php echo htmlentities($_GET['summoner'], ENT_QUOTES); ?>"
                   />
            <input id="region" name="region" type="hidden"
                   value="<?php echo htmlentities($region, ENT_QUOTES); ?>"
                   />
            <input id="form" name="form" type="hidden" value="true"/>
            <script>
                function load(select) {
                    var summoner = document.getElementById('summoner');
                    var url = select.options[select.selectedIndex].value;
                    if (summoner.value) {
                        url += '&' + encodeURIComponent(summoner.value);
                    }
                    window.location.href = url;
                }
            </script>
            <select id="regions" onchange="load(this);">
                <option value="index.php?region=br">BR</option>
                <option value="index.php?region=eune">EUNE</option>
                <option value="index.php?region=euw">EUW</option>
                <option value="index.php?region=kr">KR</option>
                <option value="index.php?region=lan">LAN</option>
                <option value="index.php?region=las">LAS</option>
                <option value="index.php?region=na">NA</option>
                <option value="index.php?region=oce">OCE</option>
                <option value="index.php?region=ru">RU</option>
                <option value="index.php?region=tr">TR</option>
            </select>
            <input type="submit" value="Submit" style="display:none;"/>
        <a href="index.php" alt="reset">Reset Values</a>
        </div>
    </form>
</section>

如果我可以把它放在提交按钮上,这样值就会在提交后附加,我认为这应该更好,但我不知道如何做到这一点。

你的意思是,当点击提交按钮时,你想发送一个召唤师参数(你的召唤师输入值)和一个区域参数(你区域选择的值)吗?然后您可以简单地将您的选择更改为:

<select name="region">
    <option value="br">BR</option>
    <option value="eune">EUNE</option>
    ....
</select>

然后你的index.php将在发送表单时同时收到一个召唤器和一个区域值。

我的另一个附带问题是,有人能告诉我正确的方向,根据访问的国家自动加载下拉值吗?

你需要一个地理定位库。使用它可以从访问者的IP地址中检测其所在的区域。然后从一组可用区域中选择最接近访问者所在区域的区域,并将选择中的相关选项标记为selected