预筛选列表项+客户端的一些UI操作。可以加快吗?

时间:2015-11-04 20:56:38

标签: jquery

有没有办法加快这个速度呢?

this.preFilter = function ($sourceSelector, text) {
    var regex = new RegExp(text, 'i');
    $sourceSelector.each(function() {
        if ($(this).text().match(regex)) {
            $(this).show();
        } else {
            $(this).children().first().attr('disabled', 'disabled');
            $(this).children().last().removeClass('addGroupMemberButtonClicked').addClass('addGroupMemberButton').button('option', 'icons', { primary: 'ui-icon-plusthick' });
            $(this).hide();
        }
    });
};

现在,对于半数元素,它需要大约0.5秒。问题是我不想提出额外的AJAX请求 - 我已经在我的富客户端用户界面中拥有大量的AJAX请求。我并不热衷于使用children()和第一个/最后一个选择器 - 他们在以后布局会改变的情况下不灵活。但是当我使用find时 - 花了7s,这当然是不可接受的......

更新:使用jQuery小部件装饰所有这些按钮不是一个好主意,如果不应用按钮循环快3倍。此外,标记不是最佳的 - 即使按钮没有文本也有一些空的跨度:(但它不是我,而是创建布局的设计师。我可以查看标记中与UI相关的类,由小部件,只是删除它们。但它不是一种正确的做事方式,我想:将来这些小部件可能会改变,类名也会不同等等。

HTML

<div style="width: auto; min-height: 2px; max-height: none; height: auto;" id="ui-id-28" class="addGroupMember ui-dialog-content ui-widget-content" data-title="Add participant">
  <input value="" name="usersearch" class="userSearchField" placeholder="Search user name" type="search">
  <input value="" name="" class="userSearchButton" type="button">
  <ul class="userList">
    <li>
      <input value="**" name="Id" class="" disabled="disabled" data-is-key="True" type="hidden">Wvgtsnewp zhnu
      <button title="" role="button" class="addGroupMemberButton ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only" type="button">
        <span class="ui-button-icon-primary ui-icon ui-icon-plusthick"></span>
          <span class="ui-button-text">
          <span class=""></span>
          <span class=""></span>
        </span>
      </button>
    </li>
    <li>and so still half of thousand items</li>
  </ul>
</div>

0 个答案:

没有答案