简体   繁体   English

如何获取较旧的jQuery版本以访问SVG元素

[英]How to get older jquery versions to access SVG element

I'm stuck using jquery 1.11.3 on an application, but jquery 1.11.3 doesn't seem to want to access elements in an SVG. 我在应用程序上使用了jquery 1.11.3,但是jquery 1.11.3似乎不想访问SVG中的元素。 Is this possible. 这可能吗。 I can't figure out why not. 我不知道为什么不这样做。

Using Jquery 1.11.3 - doesn't work ( update , now uses version 1.12.4 and it works) 使用Jquery 1.11.3-不起作用( update ,现在使用1.12.4版本,并且可以使用)

http://codepen.io/omarel/pen/zNMJOJ http://codepen.io/omarel/pen/zNMJOJ

Using jquery 3.1 - works 使用jQuery 3.1 -Works

http://codepen.io/omarel/pen/XpyBOq http://codepen.io/omarel/pen/XpyBOq

UPDATE: Thanks to @Rikin I realized I could use version 1.12.4 which starts adding classnames to SVG's and luckily this version works with the application I'm working on. 更新:感谢@Rikin,我意识到我可以使用1.12.4版本,该版本开始将类名添加到SVG中,幸运的是,此版本可与我正在处理的应用程序一起使用。

JQUERY JQUERY

 $( ".amenitylink" ).on( "click", function() {
  $('svg #lobby').toggleClass("highlight");
 });

HTML 的HTML

 <div class="amenitylink">click me</div>

 <svg version="1.1" id="main" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 width="276px" height="210px" viewBox="0 0 276 210" style="enable-background:new 0 0 276 210;" xml:space="preserve">
<style type="text/css">
 <![CDATA[
.st0{fill:none;stroke:#FFFFFF;stroke-width:11;stroke-miterlimit:10;}
]]>
</style>
 <rect id="lobby" x="13" y="17" class="st0 " width="240" height="179"/>
 </svg>

CSS 的CSS

 body {
 background-color:#000;
 color:#fff;
 }
.amenitylink {
cursor:pointer;
padding:10px;
border:1px solid white;
 }
 .highlight {
    fill:rgba(134, 117, 77, 0.4) !important;
}

As commented above v1.11.3 - It does target SVG element correctly but fails to add classname inside it. 如上述v1.11.3所述-它确实正确地定位了SVG元素,但未能在其中添加类名。 When I debugged it was showing something like this [object SVGsomething] highlight 当我调试时,它显示的是这样的内容[object SVGsomething] highlight

SVG element class addition was resolved in ~1.12.4 library and you can use that to get your issue resolve. SVG元素类的添加已在〜1.12.4库中解决,您可以使用它来解决问题。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM