zoukankan      html  css  js  c++  java
  • delegate

    在我们用javascript动态添加某一类型的元素时,这些元素需要绑定某一事件,比如click事件,那么我们就需要用到delegate函数

    如果我们在每一次动态添加这种类型的元素的时候,都为该元素绑定某一事件的话,这样比较浪费。

    delegate函数就是让我们为某一类型的元素只绑定一次某一事件即可,即使未来有若干次的删除或添加,该事件都有效。

    delegate 的函数是被某一类型的共同父元素调用,

    listNode.delegate('.condition-remove','click',function(e){

    e.preventDefault();

    $(this).parents('.search-condition-item').remove();

    });

    完整实例(要实现的效果)

    function renderSearchConditions(selectionId,conditions){var conditionsTemplate = '<div class="search-conditions-list-section">'+

    '<ul class="search-conditions-list"></ul>'+
    '</div>',
    listNode = $(conditionsTemplate);
    listItemTemplate = '<li class="search-condition-item" data-type="{conditonType}"><span>{condition}</span><a class="condition-remove" href="#">x</a></li>';

    for(var key in conditions)

    {
    var condition = conditions[key].keyword,

    conditionType = conditions[key].type,
    listItemNode = $.substitute(listItemTemplate,{conditionType:conditionType,condition:condition});
    listNode.append(listItemNode);
    }
    $(selectionId).prepend(listNode);
    listNode.delegate('.condition-remove','click',function(e){
    e.preventDefault();
    $(this).parents('.search-condition-item').remove();


    });
    }

  • 相关阅读:
    利用Python获取文件类型
    删除目录和文件
    创建目录和空文件
    读取文件内容
    sort方法
    python实例5-表格打印
    ngx.lua中遇到的小问题
    mysql 更改自动增长字段值的重新设定
    全面讲解进程池原理
    测试工程师Docker基础
  • 原文地址:https://www.cnblogs.com/lmy-ms/p/3863622.html
Copyright © 2011-2022 走看看