Question

我有一个脚本，用于检查下拉列表中选择某些选项的次数。该页面有大约一千个或更多下拉列表。选择下拉列表后，在单击所需选项后，我们会在选择并更新值之前大约冻结5秒钟。删除JavaScript时，它会立即运行并且正常。有没有办法加快JavaScript的运行速度？

这是以下脚本：

<script type="text/javascript">

    function getSelectedValues(){
        var matches1 = $('#group1 select').filter(function(){
            return $(this).val() == '1';
        }).length;
        var matches2 = $('#group2 select').filter(function(){
            return $(this).val() == '2';
        }).length;
        var matches3 = $('#group3 select').filter(function(){
            return $(this).val() == '3';
        }).length;
            var matches4 = $('#group4 select').filter(function(){
            return $(this).val() == '4';
        }).length;
            var matches5 = $('#group5 select').filter(function(){
            return $(this).val() == '5';
        }).length;
            var matches6 = $('#group6 select').filter(function(){
            return $(this).val() == '6';
        }).length;
            var matches7 = $('#group7 select').filter(function(){
            return $(this).val() == '7';
        }).length;

        // here's where we just update that new <span>
        if(matches1 > 1 || matches2 > 1 || matches3 > 1 || matches4 > 1 || matches5 > 1 || matches6 > 1 || matches7 > 1){
            $('span#resultgroup1<%=pempidw2%>').css( "color", "red" );
        }
        if(matches1 < 2 && matches2 < 2 && matches3 < 2 && matches4 < 2 && matches5 < 2 && matches6 < 2 && matches7 < 2){
            $('span#resultgroup1<%=pempidw2%>').css( "color", "black" );
        }  
    }

    // and here we bind to the change event for the selects
    // and re-call our above function.
    $('select').on('change', getSelectedValues);


</script>

帮助避免用户在多个部分输入相同的答案是JavaScript。这一切都100％有效。

Answer 1

确保您充分利用javascript / jquery语言！（也就是说，你可以加快你的代码运行速度，但不能加速javascript本身）

有许多复制/粘贴代码，例如。

var matches7 = $('#group7 select').filter(function(){
return $(this).val() == '7';

这些变量都被重构为一个方法调用，传入不同的类变量以节省空间并帮助加快程序的速度。一旦你重构它们就可以了：

if $(this).val(){$(this).parent().css{ *set whatever css here}}

这将是一个主要的加速，因为您不必检查每种类型之后的所有值，只需要您的变量类（$ this）。

编辑：我意识到.filters（）会对DOM造成严重破坏，尝试使用$("select[value=1]:checked").length代替更好的整体性能

希望有所帮助！

加速JavaScript

1 个答案: