Jquery曾经点击过两次循环

Jquery once clicked loop two times

本文关键字:两次 循环 曾经 Jquery      更新时间:2023-09-26

在我的meteorjs应用程序中,我遇到了一个问题。我做了手风琴, 点击它时迅速打开和关闭.我做了控制台日志,看到一键激活功能两次。这是我的代码:

<div class="rounded">
    <ul>
        {{#each tasksToDo}}
            {{>task}}
        {{/each}}
    </ul>
</div>

<template name="task">
<li class="list_item">
    <divs class="editable-text-trigger">
      <span>{{> editableText collection="tasks" field="title" wysiwyg=true}}</span>
    </divs>
    <div class="editBt">
        <button class="completed">Completed</button><button class="edit">Edit</button><button class="delete">Delete</button>
    </div>
</li>

Template.task.onRendered(function(){
    $('.list_item').click(function(){
        $('.editBt-active').children('.editBt').hide(400);
        if(!$(this).hasClass('editBt-active')){
            if($('.list_item').hasClass('editBt-active')){
                $('.list_item').removeClass('editBt-active');
            }
            $(this).addClass('editBt-active').children('.editBt').show(400);
        }else{
            $(this).removeClass('editBt-active');
        }
    });
});

编辑:尝试这不起作用

'click .list_item':function(click,task){
        $('.list_item').click(function(){
            $('.editBt-active').children('.editBt').hide(400);
            if(!$(this).hasClass('editBt-active')){
                if($('.list_item').hasClass('editBt-active')){
                    $('.list_item').removeClass('editBt-active');
                }
                $(this).addClass('editBt-active').children('.editBt').show(400);
            }else{
                $(this).removeClass('editBt-active');
            }
        });
    },  still the same

第二次编辑:

Template.task.events({
    'click .delete': function(){
        Meteor.call("deleteTask",this._id);
    },
    'click .list_item':function(click,task) {
        $(task.find('.editBt')).hide('.editBt');
    },
    'click .editable-text-trigger': function(click, task){
            $(task.find('.editable-text-trigger')).addClass('test');
        },
    'click .edit': function(click,task){
            $(task.find('.test')).trigger('click');
         },
    'blur .editable-text-trigger': function(blur, task){
        $(task.find('.editBt')).hide('.editBt');
    }
});

在呈现新的task模板实例时,向所有现有.list_item元素(包括来自task模板的其他实例的元素)再添加一个事件处理程序。

在 Meteor 中,定义事件处理程序的"官方"方法是:(http://docs.meteor.com/#/full/template_events)

Template.task.events({
  'click .list_item': function(event, template){
        // here the handler logic
    }
});

它将只为一个.list_item元素注册一个事件处理程序。