JS动态创建SVG元素并绑定事件
var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svg.setAttribute("width", "");
svg.setAttribute("height", "");
svg.addEventListener("load", function () { alert('loaded'); });
document.body.appendChild(svg);
以上代码可创建SVG容器并追加到body元素下,如果要添加元素,使用以下代码:
var r = document.createElementNS("http://www.w3.org/2000/svg", "rect");
r.setAttribute("fill", "#120045");
r.setAttribute("x", "");
r.setAttribute("y", "");
r.setAttribute("width", "50%");
r.setAttribute("height", "50%");
r.addEventListener("click", function () { alert('clicked'); });
svg.appendChild(r);
JS动态创建SVG元素并绑定事件的更多相关文章
- jquery 动态创建的元素,绑定事件无效之解决方法
今天遇到一个问题,动态创建的元素,绑定事件无效,如下: js 代码如下: var OaddX = $('.detright div.duibi div.duibox ul li span'); // ...
- js动态添加的元素不能绑定事件
动态生成的元素,使用.on绑定事件,比如$(document).on("click",".divclick",function(){})
- js动态创建的元素绑定事件
新创建的元素用传统的办法无法绑定,需要用live方法. 例: $('.rule').live('mouseover', function () { $(this).addClass("can ...
- js动态追加的元素如何触发事件
一般通过js或者jQuery动态添加的元素标签,通过该元素标签.class.id触发事件,是无效的.如下所示: <body> <input type="text" ...
- 【原生js】js动态添加dom,如何绑定事件
首先要明白浏览器在加载页面的时候是按顺序来加载的,这样以来就很清楚了,js动态添加dom以后,这些dom并没有绑定事件,这个时候最简单的一个办法就是:将绑定事件的方法封装到一个函数A中,在动态添加完d ...
- 使用jquery日期选择器flatpickr.js,使用js动态创建input元素时插件失效
最近写页面时需要用到,日期选择器,网上搜索了一些插件,最后使用了flatpickr.js.我是从npm 上拉下的依赖 npm install flatpickr --save 随后在页面中引入css ...
- jq动态添加的元素触发绑定事件无效
<div class='a'> <div class='b'> </div> 其中$('.a')是html页面的元素,$('.b')是jq动态添加的元素.$(&qu ...
- 使用addeventlistener为js动态创建的元素添加事件监听
点击li弹出内容,并且动态添加li之后有效 <button onclick="addFunction()">点我增加</button> <ul> ...
- JS动态添加的标签无法绑定事件解决方案~~~
今天用ajax实现动态插入数据时发现监听一直不起作用,一样的代码,非动态的就可以监听实现 这是困扰了我近一个小时的bug,后面才理解到可能是动态插入导致的! 看了看网上的解决方案,似乎都不太通俗,讲的 ...
随机推荐
- 关于CRTP(Curiously Recurring Template Prattern)的使用
在阅读frameworks/rs/cpp/util/RefBase.h之LightRefBase时,我记得<C++设计新思维>里对这种用法是有过介绍的,可是今天翻箱倒柜,怎么都找不到那本奇 ...
- [SinGuLaRiTy] NOIP膜你赛-Day 1
[SinGuLRiTy-1022] Copyright (c) SinGuLaRITy 2017. All Rights Reserved. 对于所有题目:Time Limit:1s || Memo ...
- 爬取腾讯课堂IT-互联网分类的的课程信息存入csv文件
标签(空格分隔): python from urllib.request import urlopen from bs4 import BeautifulSoup #获取IT-互联网分类每页的课程的链 ...
- 【转】ROWNUM与ORDER BY先后关系
源地址:http://www.cnblogs.com/accumulater/p/6137385.html
- [bzoj2743][HEOI2012]采花(树状数组)
题目描述 萧薰儿是古国的公主,平时的一大爱好是采花. 今天天气晴朗,阳光明媚,公主清晨便去了皇宫中新建的花园采花. 花园足够大,容纳了n朵花,花有c种颜色(用整数1-c表示),且花是排成一排的,以便于 ...
- sublime安装插件autoprefixer
安装插件autoprefixer步骤: 1.确保Node.js已经安装,未安装请 点击 这里>> 2.下载autoprefixer插件 https://github.com/sindres ...
- 资深专家深度剖析Kubernetes API Server第2章(共3章)
欢迎来到深入学习Kubernetes API Server的系列文章的第二部分.在上一部分中我们对APIserver总体,相关术语及request请求流进行探讨说明.在本部分文章中,我们主要聚焦于探究 ...
- angularJs分层服务开发
//控制层 app.controller('brandController' ,function($scope,$controller ,brandService){ $controller('bas ...
- 图片滚动插件jquery bxslider
https://www.cnblogs.com/axl234/p/4167196.html
- #333 Div2 Problem B Approximating a Constant Range(尺取法)
题目:http://codeforces.com/contest/602/problem/B 题意 :给出一个含有 n 个数的区间,要求找出一个最大的连续子区间使得这个子区间的最大值和最小值的差值不超 ...