我怎样才能创建多个这样的代码
How can I create multiple code like this one
如何创建多个这样的代码。
我想有 2 或 3 个相同的代码,例如:视频 1、视频 2、视频 3 具有相同代码的嵌入式视频。
<script type="text/javascript">
$("p iframe").hide();
function toggle(obj) {
var obj=document.getElementById(obj);
if (obj.style.display == "block") obj.style.display = "none";
else obj.style.display = "block";
}
</script>
<a href="javascript:%20void(0);" onclick="toggle('q1')">Video 1 Youtube</a>
<br />
<div id="q1" style="display: none;">
<iframe allowfullscreen="" frameborder="0" height="315" src="//www.youtube.com/embed/b8B1O0Fak5s" width="420"></iframe></div>
也许你想要这样的东西?
(假设jQuery)
<script type="javascript/text">
if (typeof (toggle_visibility) != "function") {
$(".toggle-container iframe").hide();
var toggle_visibility = function () {
$(this).parents(".toggle-container").find("iframe").toggle();
}
$(document).on("click", ".toggle-container .toggle-trigger", toggle_visibility);
}
</script>
<div class="toggle-container">
<a href="javascript:void();" class="toggle-trigger">Video 1 Youtube</a>
<br />
<iframe allowfullscreen="" frameborder="0" height="315" src="//www.youtube.com/embed/b8B1O0Fak5s" width="420"></iframe>
</div>
连续 3 个代码段的示例:http://fiddle.jshell.net/qTk7F/1/
我添加了具有选择器目的的类,并删除了未加密的 ID。
切换功能采用保存视频的div 的名称。因此,您需要做的就是复制链接,div和iFrame。
这在您的所有视频中都很常见
<script type="text/javascript">
$("p iframe").hide();
function toggle(obj) {
var obj=document.getElementById(obj);
if (obj.style.display == "block") obj.style.display = "none";
else obj.style.display = "block";
}
</script>
这是显示每个视频的链接,因此每次都需要复制
<a href="javascript:%20void(0);" onclick="toggle('q1')">Video 1 Youtube</a>
这是您的视频的显示,因此也需要复制
<div id="q1" style="display: none;">
<iframe allowfullscreen="" frameborder="0" height="315" src="//www.youtube.com/embed/b8B1O0Fak5s" width="420"></iframe>
</div>
因此,要添加第二个和第三个视频,您只需遵循您的模式即可。请注意,现在所有 ID 都是"q2"
<a href="javascript:%20void(0);" onclick="toggle('q2')">Video 2 Youtube</a>
<div id="q2" style="display: none;">
<iframe allowfullscreen="" frameborder="0" height="315" src="//www.youtube.com/embed/SomeOtherVideo" width="420"></iframe>
</div>
更复杂的解决方案是有一个div/iframe,您可以传递视频的名称。这是开车更清洁的解决方案,但我的印象是你在追求一个简单的解决方案?
相关文章:
- 如何使用我的Jquery代码创建委托事件侦听器
- 处理由无法访问的代码创建的来自Webworker的消息
- 如何使用php代码创建函数Javascript弹出框
- 根据代码创建翻转开关
- DOM 直接从他的 HTML 代码创建对象
- 使用 JavaScript 代码创建音频对象
- 使用解析从云代码创建安装对象
- 在V8中从C++代码创建自定义错误类
- 我对用php代码创建的HTML有一个问题
- 从现有的javascript代码创建angularjs应用程序
- 在javascript中,如何用更少的代码创建多个克隆,就像jQuery中的clone()方法一样
- 安全性:使用仅客户端代码创建唯一的用户连接
- 使用相同的javascript代码创建多个id
- 从HTML代码创建一个JavaScript对象
- JavaScript代码不适用于由另一段JavaScript代码创建的元素
- Onclick在html代码创建的谷歌应用程序脚本
- 我如何使用客户端(javascript)代码创建和下载html文件
- 如何在给定的链接中使用css代码创建垂直线
- 如何在IE开发人员工具中为加载时运行的代码创建断点?
- 为什么这段代码创建了一个无限循环?