I am receiving an “invalid 'in' operand st

2019-07-04 15:46发布

问题:

I am trying to add tooltips to a standalone SVG file but it is returning the following error:

TypeError: invalid 'in' operand style
[Break On This Error]   

if ( name in style ) {

for the following jquery-2.0.0 function:

// return a css property mapped to a potentially vendor prefixed property
function vendorPropName( style, name ) {

    // shortcut for names that are not vendor prefixed
    if ( name in style ) {
        return name;
    }

    // check for vendor prefixed names
    var capName = name.charAt(0).toUpperCase() + name.slice(1),
        origName = name,
        i = cssPrefixes.length;

    while ( i-- ) {
        name = cssPrefixes[ i ] + capName;
        if ( name in style ) {
            return name;
        }
    }

    return origName;
}

If I present the svg file through HTML page, it works fine. But I need it to work as a pure SVG and can’t manage to do that.

Here is the same page expressed in HTML (works) and SVG (does not). The tooltip plugin is called tooltipster (developed by Caleb Jacob).

edit: It seems that the question was stated incorrectly. Here’s a relevant quote from keith-wood.name:

The SVG DOM is different to the HTML DOM for which jQuery was designed. In particular, any attributes that can be animated are stored as objects instead of plain strings. This includes the class attribute. Thus, jQuery's functions that work with classes don't work on SVG nodes.

Several modifications of original jQuery versions can be found on the internet that try to solve this problem, but they in turn do not work with the most recent versions of jQuery plugins.

I am not sure if this makes the question answered or not though.

回答1:

I had this problem with IE10, and just solved, when I downgrade jQuery to version 1.9.1. http://code.jquery.com/jquery-1.9.1.min.js