Javascript 选择“选项”下拉列表“不在chrome上工作”_Javascript_Html_Css

Javascript 选择“选项”下拉列表“不在chrome上工作”

javascript html css

Javascript 选择“选项”下拉列表“不在chrome上工作”,javascript,html,css,Javascript,Html,Css,我有一个选项选择列表，可以根据选择更改内容。它在MSEdge、IE和FireFox上运行良好，但在Chrome上除外。也许我遗漏了什么，下面是我所有的代码：函数openCityevt，cityName{ var i，tabcontent，tablinks； tabcontent=document.getElementsByClassNametabcontent；对于i=0；i

我有一个选项选择列表，可以根据选择更改内容。它在MSEdge、IE和FireFox上运行良好，但在Chrome上除外。也许我遗漏了什么，下面是我所有的代码：

函数openCityevt，cityName{ var i，tabcontent，tablinks； tabcontent=document.getElementsByClassNametabcontent；对于i=0；i 巴黎巴黎是法国的首都

不应将单击事件直接附加到。获取所选选项的方法是通过侦听上的更改事件

更改后，这在您的openCity函数中，指的是。我得到的选定文本如下所示：

this.options[this.selectedIndex].text//巴黎、伦敦等地。这些值与.tab内容的ID匹配。然后我们展示内容

document.getElementById this.options[this.selectedIndex].text .style.display=块；文档.querySelector'.tab'.addEventListener'change'，openCity；函数openCityevt{ var i，tabcontent，tablinks； tabcontent=document.getElementsByClassNametabcontent；对于i=0；i 巴黎巴黎是法国的首都

您不应该在选项元素中使用onClick事件。改为使用select的onChange事件。尝试使用事件获取所选值。试试这个代码。这将在铬也很好的工作

<body>
<select class="tab" onchange="openCity(event)">
    <option value="london" class="tablinks">London</option>
    <option value="paris" class="tablinks">Paris</option>
</select>

<div id="london" class="tabcontent">
    <h3>London</h3>
    <p>London is the capital city of England.</p>
</div>

<div id="paris" class="tabcontent">
    <h3>Paris</h3>
    <p>Paris is the capital of France.</p>
</div>
</body>

function openCity(evt) {
        var cityName = evt.target.value;
        var i, tabcontent, tablinks;
        tabcontent = document.getElementsByClassName("tabcontent");
        for (i = 0; i < tabcontent.length; i++) {
            tabcontent[i].style.display = "none";
        }
        tablinks = document.getElementsByClassName("tablinks");
        for (i = 0; i < tablinks.length; i++) {
            tablinks[i].className = tablinks[i].className.replace(" active", "");
        }
        document.getElementById(cityName).style.display = "block";
        evt.currentTarget.className += " active";
   }

现在，我正在尝试使伦敦选项卡默认打开document.getElementByIddefaultOpen.click；不工作。有什么想法吗？@RochaCarter07我已经在新尼斯的底部添加了变化。非常感谢。