Question

为什么当我将函数添加到Snap.load（...加载SVG ...我的方法...）时，我不能再调用这个方法，它在Snap.Load（）里面？

function myComponent() {
    var paper = Snap("#svg3");

    Snap.load("svg/thermometer_o.svg", function (f) {
        paper.append(f);
        paper.selectAll("#empty").attr({fill: "#f00"});

       myMethod = function(perc){
            var v= 350 * ((perc) / 100);
            var py = (557 - v);
           animate = function(){   
          paper.selectAll("#empty").animate({height: v, y: py, x: "340"}, 3000);};
    };      


    });
}


function onPageLoad() {
    componentThermometer().myMethod(40);

}

Answer 1

有一些问题，可能有些问题只是将一些比特粘贴到SO上，但是我会提到它们以防万一。

componentThermometer（）是什么或在哪里？我没有看到它在任何地方定义。

如果以某种方式调用myComponent，则需要考虑事件的顺序。 Snap.load是异步的，因此可能需要花费任何时间。

所以你在页面加载完成后调用componentThermometer.MyMethod（）。

如果我们知道myComponent的逻辑... myMethod在Snap.load完成之前不可用。所以我不太确定该方法是如何可用的，除非在某处遗漏了一些代码。

我想你想做的是将myMethod放在Snap.load处理程序之外（我目前看不到任何理由让它存在）。并且您可能只想在Snap.load完成后调用myMethod（而不是当前在加载后定义它）。

如果您可以通过jsfiddle上的基础知识获得测试示例，那将有所帮助。

从codepen中，我就是这样做的...

var paper = Snap("#svg3");

function componentThermometer( perc ) {         
    Snap.load("https://raw.githubusercontent.com/chovancova/project/master/public_html/teplomer_1/svg/thermometer_o.svg", function(f){
        paper.append(f);
        paper.selectAll("#empty").attr({fill:"#f00"});

        animateThermometer( perc );       
  });
};   


function animateThermometer( perc ) {  
        var vyska =  350*( perc / 100);
        var py = 557-vyska  ;
        paper.selectAll("#empty").animate({height: vyska, y:py, x:"342.882"}, 800);
};

componentThermometer(50);

为什么当我将函数添加到Snap.load（...加载SVG ...我的方法...）时，我无法调用此方法，这是在Snap.Load（）内部？

1 个答案: