注入SVG元素并使用jquery访问它

时间:2016-04-16 15:14:30

标签: javascript jquery svg

我在图形内容类中动态创建svg元素(一个点),并尝试使用jquery访问点元素,但它不起作用。任何溶胶。?

 /* code for creating svg element */
 $(document).ready(function(){
    var x = 0,
    $y1 = 0;
    $con = $(".graphic-content");

    var $svg = $(svg("svg")).attr({
     "width": "946", "height": "280"
     }).appendTo($con);

   /* create a point */
      $(function() {
         $(svg("circle")).attr({
         "cx": x, "cy": $y1,"r":"3","class":"point"
          }).appendTo($svg);
  });
   /* hover effect*/
 $("circle").hover(function(){
   $(this).css("cursor", "pointer");
   alert("Hello!");
 });
});
function svg(elem) {
       return document.createElementNS("http://www.w3.org/2000/svg", elem);
    }

1 个答案:

答案 0 :(得分:1)

似乎没有定义

RadioGroup radioGroup = (RadioGroup) findViewById(R.id.radiogroupdid); radioGroup.setOnCheckedChangeListener(new OnCheckedChangeListener() { @Override public void onCheckedChanged(RadioGroup group, int checkedId) { if (checkedId == R.id.leo) { img.setImageResource(R.drawable.a); } else if (checkedId == R.id.mike) { img.setImageResource(R.drawable.b); } else if (checkedId == R.id.don) { img.setImageResource(R.drawable.c); } else if (checkedId == R.id.raph) { img.setImageResource(R.drawable.d); } } } }); x?尝试使用附加到$y1的{​​{1}},mouseenter个事件,事件委派。正在删除mouseleave电话;使用svg

设置alert()



cursor:point

.toggleClass()

/* code for creating svg element */
 $(document).ready(function() {
   var x = 0,
     $y1 = 0;
   $con = $(".graphic-content");

   var $svg = $(svg("svg")).attr({
     "width": "946",
     "height": "280"
   }).appendTo($con);

   /* create a point */
   $(function() {
     $(svg("circle")).attr({
       "cx": x,
       "cy": $y1,
       "r": "3",
       "class": "point"
     }).appendTo($svg);
   });
   /* hover effect*/
   $("svg").on("mouseenter", "circle", function(e) {
     console.log(e);
     $("body").toggleClass("hovered");
     // alert("Hello!");
   }).on("mouseleave", "circle", function(e) {
     console.log(e);
     $("body").toggleClass("hovered")
   })
 });

 function svg(elem) {
   return document.createElementNS("http://www.w3.org/2000/svg", elem);
 }