Jquery将4000个值与4000个复选框值进行比较并检查匹配项

时间:2014-05-16 13:38:42

标签: javascript jquery browser checkbox

我继承了一些伪劣的代码。我遇到的主要问题是浏览器(我使用Chrome浏览器)可能需要遍历可能数千个值(它可能不太可能发生),将这些值与潜在数千个值进行比较复选框值和检查匹配的(我知道这是糟糕的设计)。我创建了一个小提琴来说明大约4000个值和复选框:http://jsfiddle.net/zargarf/LG83j/3/

function checkAppropriateCheckBoxes(divId, inputName) {
    var start = new Date().getTime();
        var val = $('#' + divId).prop('value');
    var boxes = $("input[name='" + inputName + "']");
        if (val != '') {
            var boxes=$("input[name='" + inputName + "']");
                $.each(val.split(",").slice(0, -1),
                    function(index, item) {
                        boxes.each(function() {

                            if ($(this).prop("value") == $.trim(item)) {
                                $(this).prop("checked", true);
                                return false;
                            }
                        });
                    });

        }
    alert((new Date().getTime() - start));
    }

  $('.selectAll').click(function(){
       $('#courses input:checkbox').prop('checked', true);
        return false;
    });
   $('.selectNone').click(function(){

       $('#courses input:checkbox').prop('checked', false);
   });

checkAppropriateCheckBoxes('sessionCourse', 'course');

html结构类似于以下内容:

<p>
<input id="sessionCourse" type="hidden" value="2SFASSA08R/131401,6CDCNHA01R/131501,loads more comma separated values"/>
</p>
<div id="courses">
<ul id="course" name="course" class="filters_value_list">
<li><input type="checkbox" name="course" id="cbcol-6EDEIPB01R/121401" value="6EDEIPB01R/121401"><label for="cbcol-6EDEIPB01R/121401" class="cognosFilterLabel">(AWE) BTEC L3 Diploma in Electrical/Electronic Engineering (6EDEIPB01R/121401)</label></li>

repeated for a tonne of lines
</ul>
</div>

基本上,要渲染页面需要20秒以上,并且要检查相应的复选框。基本上,当在正确的应用程序中使用时,它会在处理过程中冻结ajax等待图像(未在小提琴中显示)。

您是否有任何想法如何加快迭代速度并阻止浏览器阻止旋转图像旋转?

提前感谢您的帮助

0 个答案:

没有答案