如何获取选定的值以显示下拉菜单

Question

我有一个下拉菜单，效果很好，切换页面是否完美无缺。 问题是当加载并显示所选页面时，我需要它在下拉菜单中显示所选名称，因为它是活动页面。 我有以下代码：

       <div class="about-navDropWrapper">
            <select onchange="location = this.options[this.selectedIndex].value;">
                <?php 
                            if ( get_field('games_nav_drop_down_link', 'option') ):
                                while( has_sub_field('games_nav_drop_down_link', 'option') ) :
                        ?>
                        <option value="<?php echo get_sub_field('games_nav_drop_down_link_one', 'option'); ?>"><?php echo get_sub_field('games_nav_drop_down_name', 'option'); ?></option>
                        <?php 
                            endwhile;
                            endif;
                        ?>
            </select>
        </div>

有什么建议么？

Answer 1

您可以将selected="selected"属性添加到所选页面的option元素中。 您可以在jquery中通过找到具有所需元素值的<option>来执行此操作（ 请注意，我假设values末尾的>是错字并将其删除了 ）：

例如，假设我们要显示page3.html 。

 var selected = "page3.html"; // Would be replaced with the page by location $("#selectItem option[value='"+selected+"']").attr("selected", "selected"); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="about-navDropWrapper"> <select id="selectItem"> <option value="page1.html">Page 1</option> <option value="page2.html">Page 2</option> <option value="page3.html">Page 3</option> <option value="page4.html">Page 4</option> </select> </div> 

Answer 2

请尝试以下方法：

 <script>
        onload = function () {

            var thisPage = location.pathname.replace("/", "");

            document.getElementsByTagName("select")[0].value = thisPage;
        }
    </script>