Question

我在Javascript中键入了以下代码，它只是隐藏并显示带有youtube视频的div。：

使用Javascript：

function showVideo2()
{
    document.getElementById("TheVid").style.opacity = 1;

}
function hideVideo2()
{
    document.getElementById("TheVid").style.opacity = 0;

}

function determineShowHideVid()
    {
        if (document.getElementById("PlayerDetermine").innerHTML.match ="Play")
        {
            showVideo2();
            document.getElementById("PlayerDetermine").innerHTML = "Close";
        }
        else
        {
            hideVideo2();
            document.getElementById("PlayerDetermine").innerHTML = "Play";
        }
    }

HTML

<body>
    <div class='container'>
        <div class='row' id= 'BodyDiv1' name = 'BodyDiv'>
            <button type='submit' onclick='determineShowHideVid()' id='PlayerDetermine'>Play</button>
            <button type='submit' onclick='showVideo2()'>Play</button>
            <button type='submit' onclick='hideVideo2()'>x</button>

            <div class='col-md-8' id='TheVid'>
                <div class="vid">
                    <iframe class="youtube-player" type="text/html" width="430" height="150" 
src="//www.youtube.com/embed/jx83rMjic5w?wmode=opaque?html5=1" allowfullscreen frameborder="0">
                    </iframe>
                </div>
            </div>
        </div>
    </div>
</body>

CSS

#TheVid { 

   -webkit-transition: opacity 2s;
   -moz-transition: opacity 2s;
   -o-transition: opacity 2s;
   transition: opacity 2s;
}
.vid {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}

.vid iframe,
.vid object,
.vid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

但是，只有'hideVideo2()'和showVideo2()有效，而DetermShowHideVid（）则不然。我试图获得innerHTML，如果它说Play，视频显示。如果没有，视频会隐藏。

问题是，Button元素PlayerDetermine将其文本内容更改为关闭并显示视频，但不会将其隐藏。

我在javascript中的IF语句有问题吗？

Answer 1

添加==运算符，以便从您的.match中删除if，并将其设为：

...
if (document.getElementById("PlayerDetermine").innerHTML == "Play") {
...

Answer 2

你应该试试这个

https://stackoverflow.com/users/142410/vian-esterhuizen

的完整学分

Check if YouTube video is playing and run script

这是我认为你可以检测到嵌入式YouTube视频是否正在播放的最干净的方式，因此你可以在html上进行准确的DOM更改

如果不是在Javascript中使用.innerHTML

2 个答案: