Criar função para remover o próprio elemento

daniel.uramg
(usa Outra)

Enviado em 29/08/2014 - 12:01h

Bom dia pessoal,

estou tentando fazer uma função para no ato do clique-duplo remover o elemento que foi clicado
porém quero uma função que englobe qualquer elemento do site, consegui fazer somente para elementos específicos como:

    $("img").dblclick(function() {

        function removeThis(element) {

            console.log(element); //exibe no console o elemento que vai remover

            element.remove();

        };

        removeThis(this);

    });

 

desta maneira se eu der um double click em qualquer imagem do site ela some, mas não estou conseguindo fazer a função valer pra tudo, será que existe alguma forma?

agradeço qqr conselho!

lap86
(usa CentOS)

Enviado em 15/12/2014 - 18:50h

Bom, você está usando jQuery? Acredito que sim.
Mas perceba que você está criando uma função dentro do double click, não tem necessidade disso. Basta usar o this do escopo e chamar a função remove() do jQuery, assim:

<script>

    $("*").dblclick(function(event){

        event.stopPropagation();

        $(this).remove();

    });

</script>

 

Esse event.stopPropagation() serve para impedir que o evento de double click se propague pelos pais do elemento clicado.
E veja que o seletor é um asterisco, que indica qualquer elemento. Isso pode arruinar seu aplicativo, é bom colocar uma trava, se não tudo o que o usuário clicar será removido.

daniel.uramg
(usa Outra)

Enviado em 15/12/2014 - 19:23h

Opa lap86 obrigado pelo retorno
eu tinha conseguido resolver já
essa ideia foi pra criar um userscript e remover elementos de paginas muito poluidas pra facilitar a navegação, o evento dbclick atrapalhou um pouco pois as vezes eu ia dar um db-click pra selecionar um texto e o paragrafo ia embora, entao coloquei com ctrl+right-click

pra quem quiser usar, aqui rodo com Tampermonkey no Chrome:

// ==UserScript==

// @name	RemoveThis

// @description	Remove qualquer elemento que recebeu um ctrl + right-click

// @author	daniel.uramg@gmail.com

// @version	0.23

// @downloadURL	http://webtracker.zapto.org/js/removethis.js

// @require     http://webtracker.ddns.net/js/jquery-2.1.1.min.js

// @match	http://*/*

// @match	https://*/*

// ==/UserScript==



function injectCSS(cssdata){

    $("head").append("<style type='text/css'>"+cssdata+"</style>");

}



$(document).ready(function(){

    

    var debug = false;

    

    //função para remover o elemento

    function removeThis(element) {

        if (debug == true) console.log(element + " removido"); //exibe no console o elemento que vai remover

        $(element).remove();

    }

    

    //Injeta CSS para destaque

    injectCSS(".removethis{border-width: 2px; border-color: yellow; background-color: yellow; border: inset;}");

    

    //dar destaque no elemento em foco

    var addclass = function(e){

        if (e.ctrlKey) { //Ctrl é pressionado

            $(e.target).addClass('removethis');

            if (debug == true) console.log(e.target + " recebeu detaque"); //exibe no console o elemento que recebeu foco

            e.stopPropagation();

        }

    };

    

    //remover destaque no elemento que perdeu o foco

    var removeclass = function(e){

        if (e.ctrlKey) { //Ctrl é pressionado

            $(e.target).removeClass('removethis');

            if (debug == true) console.log(e.target + " perdeu detaque"); //exibe no console o elemento que perdeu foco

            e.stopPropagation();

        }

    };

    

    $('*').on("mouseenter", addclass); //Chama função para destaque quando chegar o mouse

    $('*').on("mouseleave", removeclass); //Chama função para remover destaque quando sair o mouse

    

    

    //remove o elemento clicado com Ctrl pressionado

    $('*').on("contextmenu", function(e){ //Botão direito é pressionado

        if(e.ctrlKey){ //Ctrl é pressionado

            removeThis(e.target);

            return false; //evita a propagation

        }

    })

    

    //Remove destaque de todos elementos quando soltar uma tecla

    $(document).keyup(function (e) {  //O evento Kyeup é acionado quando as teclas são soltas

            if (debug == true) console.log("ctrl foi solto");

            $('*').removeClass('removethis');

    })

    

})