Question

我有一个youtube iframe。选择名称。

HTML：

<div class="video"> 
    <iframe width="420" height="315" name="selection"
    src="" 
    frameborder="0" allowfullscreen></iframe>
</div>

<a onclick="changeMusic()" href="javascript:void(0);" class="btn btn-default btn-lg"><span class="glyphicon glyphicon-step-forward"></span> Next Song&nbsp; </a>

当我点击按钮时，我想在javascript中增加一个整数，以便iframe的src随数组索引而变化。

JS：

list[0] = "https://www.youtube.com/embed/mQ1huZuZVNA"
list[1] = "https://www.youtube.com/embed/qZH5aY48BP8"

var max = 1;
var min = 0;
var x =  0;

//Math.floor(Math.random() * (max - min + 1)) + min;

document.getElementsByName("selection").src = list[x]; 

function changeMusic() {    

    if(x<max){
        x = 1;
        document.getElementsByName("selection").src = list[x]; 
    }
    else
    {
        x = 0;
        document.getElementsByName("selection").src = list[x];
    }

}

当页面首次加载时，我想将第一个索引显示为列表[0]，以便在iframe中播放youtube链接。只要有人单击某个按钮，就会将数组索引0更改为1或1更改为0，以便更改视频链接。

但它甚至没有加载数组中的第一个链接。

Answer 1

将list定义为array：var list = [];

语法错误，因为正确的语法是getElementsByName而不是getElementByName。 getElementsByName()方法返回文档中具有指定名称
的所有元素的集合

＆＃13;

var list = [];
list[0] = "https://www.youtube.com/embed/mQ1huZuZVNA";
list[1] = "https://www.youtube.com/embed/qZH5aY48BP8";
var max = 1;
var min = 0;
var x = 0;
var selectionElem = document.getElementsByName("selection")[0];
selectionElem.src = list[x];
function changeMusic() {
	if (x < max) {
		x = 1;
		selectionElem.src = list[x];
	}
	else {
		x = 0;
		selectionElem.src = list[x];
	}
}

＆＃13;

<div class="video">
  <iframe width="420" height="315" name="selection" src="" frameborder="0" allowfullscreen></iframe>
</div>

<a onclick="changeMusic()" href="javascript:void(0);" class="btn btn-default btn-lg"><span class="glyphicon glyphicon-step-forward"></span> Next Song&nbsp; </a>

＆＃13;

Answer 2

您的代码在2次更改后正常工作。

您必须声明数组img { position: absolute; margin-right: auto; margin-left: auto; vertical-align: middle; }：
```
list
```
您必须选择var list = [];返回的第一个元素，因为它将返回名称为getElementsByName()的所有元素：
```
selection
```

希望这有帮助。

document.getElementsByName("selection")[0].src = list[x];

var list = [];

list[0] = "https://www.youtube.com/embed/mQ1huZuZVNA"
list[1] = "https://www.youtube.com/embed/qZH5aY48BP8"

var max = 1;
var min = 0;
var x =  0;

document.getElementsByName("selection")[0].src = list[x]; 

changeMusic = function () {    

 if(x<max){
 x = 1;
 document.getElementsByName("selection")[0].src = list[x]; 
 }
 else{
 x = 0;
 document.getElementsByName("selection")[0].src = list[x];
 }

}

Answer 3

您需要访问getElementsByName

返回的集合的第一个元素

document.getElementsByName("selection")[0].src = list[x]

它总是返回一个节点列表（因为可以有更多具有相同名称的元素）

用按钮改变src

3 个答案: