У меня есть index.html
, в моем index.html
есть два выпадающих контейнера и iframe.
Но это работает в выпадающем списке номер один с iframe, а выпадающий номер 2 не работает, кто-нибудь может это исправить?
Я не совсем понимаю этот скрипт для изменения iframe:
function iframeChange() {
var buttons = document.querySelector(".dropdown-container");
var iframe = document.getElementById('frame');
var mySelect = document.getElementById('mySelect');
buttons.addEventListener("click", function (e) {
mySelect.src = e.target.dataset.src;
mySelect.id = e.target.dataset.id;
mySelect.width = e.target.dataset.width;
mySelect.height = e.target.dataset.height;
mySelect.title = e.target.dataset.title;
iframe.src = e.target.dataset.src;
iframe.width = e.target.dataset.width;
iframe.height = e.target.dataset.height;
iframe.title = e.target.dataset.title;
});
}
window.onload = iframeChange;
мой скрипт работает на локальном ПК
<div id="mySidebar" class="sidebar">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
<button id="mySelect" class="dropdown-btn">BCA - SALES
<i class="fa fa-caret-down"></i>
</button>
<div id="mySelect" class="dropdown-container">
<li><a id="mySelect" data-src="https://192.168.90.240/single/?appid=1ab7d1b9-5a9f-4337-9215-7e1e036625d1&sheet=83e3821d-2afc-45bd-be16-7d95a1065a8d&opt=currsel" data-width="100%" data-height="550px">DASHBOARD I</a></li>
<li><a id="mySelect" data-src="https://192.168.90.240/single/?appid=1ab7d1b9-5a9f-4337-9215-7e1e036625d1&sheet=828499e7-da76-4f1c-aa43-b4accbfbd203&opt=currsel" data-width="100%" data-height="550px">DASHBOARD II</a></li>
<li><a id="mySelect" data-src="https://192.168.90.240/single/?appid=1ab7d1b9-5a9f-4337-9215-7e1e036625d1&sheet=89c0893e-d526-4af3-aaf8-68a1d54cb96d&opt=currsel" data-width="100%" data-height="550px">DASHBOARD III</a></li>
<li><a id="mySelect" data-src="https://192.168.90.240/single/?appid=1ab7d1b9-5a9f-4337-9215-7e1e036625d1&sheet=7b3fe051-8219-469f-994b-7ea249ee2b73&opt=currsel" data-width="100%" data-height="550px">DASHBOARD IV</a></li>
</div>
<button id="mySelect" class="dropdown-btn">BCA - MARKETING
<i class="fa fa-caret-down"></i>
</button>
<div id="mySelect" class="dropdown-container">
<li><a id="mySelect" data-src="https://192.168.90.240/single/?appid=1ab7d1b9-5a9f-4337-9215-7e1e036625d1&sheet=83e3821d-2afc-45bd-be16-7d95a1065a8d&opt=currsel" data-width="100%" data-height="550px">DASHBOARD I</a></li>
<li><a id="mySelect" data-src="https://192.168.90.240/single/?appid=1ab7d1b9-5a9f-4337-9215-7e1e036625d1&sheet=828499e7-da76-4f1c-aa43-b4accbfbd203&opt=currsel" data-width="100%" data-height="550px">DASHBOARD II</a></li>
<li><a id="mySelect" data-src="https://192.168.90.240/single/?appid=1ab7d1b9-5a9f-4337-9215-7e1e036625d1&sheet=89c0893e-d526-4af3-aaf8-68a1d54cb96d&opt=currsel" data-width="100%" data-height="550px">DASHBOARD III</a></li>
<li><a id="mySelect" data-src="https://192.168.90.240/single/?appid=1ab7d1b9-5a9f-4337-9215-7e1e036625d1&sheet=7b3fe051-8219-469f-994b-7ea249ee2b73&opt=currsel" data-width="100%" data-height="550px">DASHBOARD IV</a></li>
</div>
мой ожидаемый выпадающий список 2 работает.
исходный файл: https://github.com/GoLeR797370/Perpustakaan23.git скачатьmashup.html