jQuery-点击按钮插入视频

目标效果：

运行显示一个按钮，点击按钮可以添加一个视频，并且视频可以正常播放。

1.首先获取视频地址，找到视频页面，打开分享，复制html代码中的地址。

2.创建网站，添加添加html页面，并且导入jQuery框架库。

3.编写处理代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<head><title></title><script src="js/jquery-1.8.0.min.js" type="text/javascript"></script><script type="text/javascript">$(function () {$("#btClick").click(function () {var url="<embed src='http://player.video.qiyi.com/ead4ef6ab0709a876734c656cc33e226/0/0/w_19rsxw7u0x.swf-albumId=5563560109-tvId=5563560109-isPurchase=0-cnId=20' allowFullScreen='true' quality='high' width='480' height='350' align='middle' allowScriptAccess='always' type='application/x-shockwave-flash'></embed>"var a = $("<div>" + url + "</div>");$(a).appendTo("body"); //将创建的节点a添加到body标签中});});</script>
</head>
<body><input type="button" id="btClick" value="添加"/>
</body>
</html>

4.需要注意的是，将地址复制上去会提示错误，需要将地址中的双引号改成单引号，只有最外边是双引号。

5.运行就可以了。

jQuery-点击按钮插入视频相关推荐

jquery点击按钮显示和隐藏div
[转]jquery点击按钮显示和隐藏DIv 1 function changeDisplay() { 2 if ($("#btnShow").attr("value&qu ...
onclick 获取点击之后的img 的id_前端，点击按钮跳出视频带蒙层，且视频永远居于屏幕中间...
1.前言: 做之前问了一下度娘,发现参考好像很少,就把我这个不成熟的代码放上来,做个参考(刚入行没多久,代码比较迷,接受批评) 2.实现效果: 视频点击播放前的区域效果点击这个button按钮图,视 ...
jQuery 点击按钮刷新页面
//页面加载时绑定按钮点击事件$(function () {$("#按钮id").click(function () {refresh();});});//点击按钮调用的方法fun ...
php点击按钮显示隐藏代码,jQuery中点击按钮实现显示与隐藏的方法
jQuery能够简单快捷的实现很多功能,因此在前端开发中被广泛使用,正在学习jQuery的小伙伴,你会用jQuery实现点击显示再次点击隐藏的效果吗(即jQuery二次点击隐藏)?这篇文章就和大家讲讲 ...
php 表单同步,Jquery点击按钮异步和同步提交表单
最近在开发一个jsp学生信息管理系统,由于刚刚接触jsp,遇到问题比较多,特此记录与大家分享. Jquery ajax提交表单到servlet示例前台部分代码: 姓名学号 ajax提交表 ...
jQuery点击按钮新增dom
在一个jQuery项目中,遇到了一个需求,即点击新增按钮进行新增一组输入框,点击删除删除一组输入框,如果是vue/react项目就可以很容易的去实现,也没有什么可以说的复杂操作,但是这是jQuery! ...
H5页面点击按钮播放视频，默认全屏播放，取消全屏后播放器自动隐藏
/*** @description 播放全屏 * @param {Object} element*/function launchFullScreen(element) {if (element.re ...
jquery点击按钮切换样式
实现点击两个按钮的切换 css: .fui-cell-info {display: flex;}.fui-cell-a {padding: 4px 18px;border: 1px solid #68 ...
JQuery点击按钮数字递增递减
在很多电商网站中,在购物车所在页面,涉及到商品数量的时候,都会提供一个+号按钮和-号按钮来实现增1和减1,并且只允许input中输入数值.如下 <!DOCTYPE HTML> <ht ...
jquery 点击按钮复制文本内容（亲测有效）
function copyText(text) {var oInput = document.createElement('input');oInput.value = text;document.b ...

jQuery-点击按钮插入视频

jQuery-点击按钮插入视频相关推荐

最新文章

热门文章