单击鼠标更改SVG字体大小 [英] Change SVG font size with a mouse click

问题描述

我正在尝试使用以下方法更改SVG文本的大小:

I'm trying to change the size of a SVG text using this:

$("#text"+x).click(function(){
    //$(this).style("font-size", "4");
    document.getElementById("text"+x).setAttributeNS(null, "font-size", "4px");
    //this.attr("font-size", "4px");
    alert('it is I'); 
});

您可以在那看到我大多数失败的尝试.我收到警报弹出，但没有任何反应，也没有错误消息. 我已经搜索了网络，但堆栈溢出无济于事... 我正在使用JS + Jquery！

You can see most of my failed attempts right there. I get the alert to pop up, but nothing happens and no error message. I've searched the web and Stack Overflow to no avail... I'm using JS + Jquery!

欢迎任何提示！
干杯！

Any hints are welcomed!
Cheers!

推荐答案

使用以下代码.检查 DEMO .您需要将font-size设置为属性.

use below code. check DEMO. you need to set font-size as attribute.

 $(document).ready(function(){ 
  $("#text"+x).on('click',function(){
    $(this).attr("font-size", "50");
    alert('it is I'); 
  });
 });

或者如果您要动态添加svg元素，请使用以下代码

or if you are adding svg element dynamically use below code

 $(document).ready(function(){ 
    $(document).on('click',"#text"+x,function(){
      $(this).attr("font-size", "50");
      alert('it is I'); 
    });
 });

这篇关于单击鼠标更改SVG字体大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！