Пример того, как было реализовано переключение уличных камер видеонаблюдения на одном из сайтов.
Это код HTML:
<center><iframe width="640" height="480" src="https://ссылка" frameborder="0" allowfullscreen></iframe></center>
<center>
<input class="btn btn-primary" type="button" id="buttonCamera1" value="Камера 1">
<input class="btn btn-primary" type="button" id="buttonCamera2" value="Камера 2">
<input class="btn btn-primary" type="button" id="buttonCamera3" value="Камера 3">
<input class="btn btn-primary" type="button" id="buttonCamera4" value="Камера 4">
<input class="btn btn-primary" type="button" id="buttonCamera5" value="Камера 5">
<input class="btn btn-primary" type="button" id="buttonCamera6" value="Камера 6">
<input class="btn btn-primary" type="button" id="buttonCamera7" value="Камера 7">
<input class="btn btn-primary" type="button" id="buttonCamera8" value="Камера 8">
<input class="btn btn-primary" type="button" id="buttonCamera9" value="Камера 9">
<input class="btn btn-primary" type="button" id="buttonCamera10" value="Камера 10">
</center>
А это код JS:
<script>
function Camera1() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка');
}
function Camera2() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка');
}
function Camera3() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка');
}
function Camera4() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка');
}
function Camera5() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка');
}
function Camera6() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка');
}
function Camera7() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка');
}
function Camera8() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка');
}
function Camera9() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка');
}
function Camera10() {
document.querySelector('iframe').setAttribute('src', 'https://ссылка/');
}
buttonCamera1.onclick = Camera1;
buttonCamera2.onclick = Camera2;
buttonCamera3.onclick = Camera3;
buttonCamera4.onclick = Camera4;
buttonCamera5.onclick = Camera5;
buttonCamera6.onclick = Camera6;
buttonCamera7.onclick = Camera7;
buttonCamera8.onclick = Camera8;
buttonCamera9.onclick = Camera9;
buttonCamera10.onclick = Camera10;
</script> 