將javascript函數放入其他函數的正確語法

Question

我有這段代碼是一對小動畫。

function circle_progess() { 
    var divElement = $('div'); //log all div elements 
    if (retina()) { 
    $(".whiteCircle").knob({ 
     'min': 0, 
     'max': 100, 
     'readOnly': true, 
     'width': 240, 
     'height': 240, 
     'bgColor': 'rgba(255,255,255,0.5)', 
     'fgColor': 'rgba(255,255,255,0.9)', 
     'dynamicDraw': true, 
     'thickness': 0.1, 
     'tickColorizeValues': true 
    }); 

    $(".circleStat").css('zoom', 0.5); 
    $(".whiteCircle").css('zoom', 0.999); 
    } else { 

    $(".whiteCircle").knob({ 
     'min': 0, 
     'max': 100, 
     'readOnly': true, 
     'width': 120, 
     'height': 120, 
     'bgColor': 'rgba(255,255,255,0.5)', 
     'fgColor': 'rgba(255,255,255,0.9)', 
     'dynamicDraw': true, 
     'thickness': 0.1, 
     'tickColorizeValues': true 
    }); 
    } 

    $(".circleStatsItemBox").each(function() { 
    var value = $(this).find(".count > .number").html(); 
    var unit = $(this).find(".value > .unit").html(); 
    var percent = $(this).find("input").val()/100; 

    countSpeed = 2300 * percent; 
    endValue = value; 

    $(this).find(".count > .unit").html(unit); 
    $(this).find(".count > .number").countTo({ 
     from: 0, 
     to: endValue, 
     speed: countSpeed, 
     refreshInterval: 50 
    }); 

    //$(this).find(".count").html(value*percent + unit); 
    }); 
} 

我想替換下面的代碼行，當用上面的代碼滾動時會給出警報。所以我執行滾動功能。我似乎不能整合代碼，有人可以幫我嗎？

var $findme = $('.whiteCircle'); 

function Scrolled() { 
    $findme.each(function() { 
    var $section = $(this), 
     findmeOffset = $section.offset(), 
     findmeTop = findmeOffset.top, 
     findmeBottom = $section.height() + findmeTop, 
     scrollTop = $(document).scrollTop(), 
     visibleBottom = window.innerHeight, 
     prevVisible = $section.prop('_visible'); 

    if ((findmeTop > scrollTop + visibleBottom) || 
     findmeBottom < scrollTop) { 
     visible = false; 
    } else visible = true; 

    if (!prevVisible && visible) { 
     alert($section.text()); 
    } 
    $section.prop('_visible', visible); 
    }); 

} 

function Setup() { 
    var $top = $('#top'), 
    $bottom = $('#bottom'); 

    $top.height(500); 
    $bottom.height(500); 

    $(window).scroll(function() { 
    Scrolled(); 
    }); 
} 

$(document).ready(function() { 
    Setup(); 

}); 

乾脆就把我想這個....

var $findme = $('circle_progress'); 

function Scrolled() { 
    $findme.each(function() { 
      var $section = $(this), 
      findmeOffset = $section.offset(), 
      findmeTop = findmeOffset.top, 
      findmeBottom = $section.height() + findmeTop, 
      scrollTop = $(document).scrollTop(), 
      visibleBottom = window.innerHeight, 
      prevVisible = $section.prop('_visible'); 

      if ((findmeTop > scrollTop + visibleBottom) || 
      findmeBottom < scrollTop) { 
      visible = false; 
      } else visible = true; 

      if (!prevVisible && visible) { 


      function circle_progess() { 

       var divElement = $('div'); //log all div elements 

       if (retina()) { 

       $(".whiteCircle").knob({ 
        'min': 0, 
        'max': 100, 
        'readOnly': true, 
        'width': 240, 
        'height': 240, 
        'bgColor': 'rgba(255,255,255,0.5)', 
        'fgColor': 'rgba(255,255,255,0.9)', 
        'dynamicDraw': true, 
        'thickness': 0.1, 
        'tickColorizeValues': true 
       }); 

       $(".circleStat").css('zoom', 0.5); 
       $(".whiteCircle").css('zoom', 0.999); 


       } else { 

       $(".whiteCircle").knob({ 
        'min': 0, 
        'max': 100, 
        'readOnly': true, 
        'width': 120, 
        'height': 120, 
        'bgColor': 'rgba(255,255,255,0.5)', 
        'fgColor': 'rgba(255,255,255,0.9)', 
        'dynamicDraw': true, 
        'thickness': 0.1, 
        'tickColorizeValues': true 
       }); 

       } 



       $(".circleStatsItemBox").each(function() { 
       var value = $(this).find(".count > .number").html(); 
       var unit = $(this).find(".value > .unit").html(); 
       var percent = $(this).find("input").val()/100; 

       countSpeed = 2300 * percent; 
       endValue = value; 

       $(this).find(".count > .unit").html(unit); 
       $(this).find(".count > .number").countTo({ 
        from: 0, 
        to: endValue, 
        speed: countSpeed, 
        refreshInterval: 50 
       }); 

       //$(this).find(".count").html(value*percent + unit); 
       }); 

      } 

HTML加給輸出會是什麼樣一些清晰....

<div class="circleStatsItemBox blue"> 
<div class="header">Levels of Involvement</div> 
<span class="percent">% Increase</span> 
<div class="circleStat"> <input value="20" class="whiteCircle" type="text"> </div> 
<div class="footer"><span class="count"> <span class="number">40</span> <span>Before</span> 
</span> <span class="sep">/</span> <span class="value"> <span class="number">50</span><span class="unit"> During</span></span> </div> 
</div> 

Answer 1

你不需要將函數定義放入其他代碼中。只是把它留在外面，寫：

if (!prevVisible && visible) { 
    circle_progress(); 
}