várias ações precisam ser realizar no selector único

votos
1

O caso :

Eu tenho uma lista de itens que manipulam css para o selecionado para aplicar 'efeito selecionado'. Por exemplo, uma vez por qualquer li especificado foram clicado, ele executar este código:

    $(document).on( 'click', 'li', function (){      
    $('li').removeClass('selected');
      $(this).addClass('selected');
});

mas na li, ele precisa executar outra ação, porque eu tenho um outro link dentro do li:

<li class=selected><a href=#><span class=items>Item 1</span></a><a href=#><span class=edit>edit</span></a></li>

esta

minha pergunta :

Como evitar chamar a função de clique quando eu clicar sobre as outras ligações (por exemplo, 'editar' acima)? não porque minha intenção é selecionar o li ..

Pensei dentro da função clique, eu posso colocar um 'se a expressão' para quando não estiver no link editar foram clicados, em seguida, proceder ..

mas eu procurar se alguma maneira melhor ..

Publicado 08/08/2013 em 11:07
fonte usuário
Em outras línguas...                            


3 respostas

votos
1

Você pode tentar criar dois manipuladores separados para os dois links de âncora dentro de sua li.

por exemplo:

$(document).on( 'click', '.items', function (e) {
     //Items handler
     $(this).addClass('selected');
});

$(document).on( 'click', '.edit', function (e) { 
     //edit handler
     $(this).addClass('selected');
});
Respondeu 08/08/2013 em 11:32
fonte usuário

votos
1

Como evitar chamar a função de clique quando eu clicar sobre as outras ligações (por exemplo, 'editar' acima)?

Em seu manipulador para o link "editar", usar event.stopPropagation()para impedir que ele borbulhando ao li.

Desde que você está usando delegação, você pode fazer isso como este: Viver Exemplo | vivo Fonte

$(document).on('click', '.edit', function(event) {
    $("<p>Do the edit...</p>").appendTo(document.body);
    event.stopPropagation();             // <=== The important bit
}).on('click', 'li', function (){
    $('li').removeClass('selected');
    $(this).addClass('selected');
    return false;
});

(I também adicionado return falseao segundo porque as ligações nas lis foram causando a página para saltar.)

Respondeu 08/08/2013 em 11:09
fonte usuário

votos
0

Enrole o manipulador com um destino de evento:

$(document).on( 'click', 'li', function (e) { 
    $elem = $(e.target);
    if ($elem.hasClass('edit')) {
        // your handler for edit...
    } else {
        // check for other conditions or elements if you need...

        $('li').removeClass('selected');
        $(this).addClass('selected');
    }
});
Respondeu 08/08/2013 em 11:11
fonte usuário

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more