Question

我正在映射我从ajax调用中收到的值。它工作得很好，但在ie7中仍然不够快（我得到一个缓慢的脚本警告）。

我无法想办法让这更快。我也尝试过使用原生的javascript函数，但速度提升可以忽略不计。你们有什么想法吗？

var $audit = $('#audit');

$.each(data, function (i, val) {

    if (val != null && val !== '0') {

        $audit.find('input[type="checkbox"].' + i).attr('checked', val == 1);
        $audit.find('input[type="text"].' + i).val(val);
        $audit.find('select.' + i).val(val);
    }

});

一些psuedo-html：

<div id="audit">
    <input type="text" class="foo1" />
    <input type="checkbox" class="foo2" />
    <select class="foo3">
        <option value="1">1</option>
    </select>
</div>

Answer 1

我不知道它是否有用，但你可以缓存你的输入+选择并只是过滤而不是一遍又一遍地找到“相同”的元素，只是过滤掉一个小得多的集合中的特定元素：

var $audit = $('#audit'),
    $inputs = $audit.find('input, select');

$.each(data, function (i, val) {
    if (val != null && val !== '0') {
        var current = $inputs.filter('.' + i);
        if(current.is(":checkbox") {
            current.attr('checked', val === 1);
        } else {
            current.val(val);
        }
    }
});

Answer 2

您可以尝试将knockout.js用于您的目的。可能更快。

这是数据绑定的一个示例：http://knockoutjs.com/examples/controlTypes.html

Answer 3

每次迭代时，当范围链不断进入和离开DOM时，它的速度就太慢了。然而，循环花了很长时间才引出一个问题：页面上有多少这些div？如果它超过50左右，那么你就会遇到UI设计问题。

为了更快地实现这一目标，我们需要对代码进行彻底的重新设计。如果是我，我会构建一个包含重复div作为javascript字符串的HTML framgent，然后使用单个createElement /设置innerHTML将其拼接到页面中

提高映射性能

3 个答案: