Visualizzazione dei risultati da 1 a 9 su 9
  1. #1

    catturare il valore senza aggiungere l'attributo del metodo

    Ciao a tutti,
    vorrei poter catturare l'id dell'elemento che richiama la funzione senza doverlo specificare come attributo.
    E' fattibile?

    Attualmente faccio così:
    codice:
    $('#id_tipo').change(function(){
        prova($(this).attr("id"));
    });
    codice:
    function prova(e){
        var id = $("#"+e).val();
        ...
    };
    Grazie a tutti

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,684
    Ciao, cosa intendi per "senza doverlo specificare come attributo"?
    Puoi spiegare cosa stai cercando di fare esattamente?
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  3. #3
    Ciao KillerWorm, ecco il risultato che vorrei ottenere:
    codice:
    $('#id_tipo').change(function(){
        prova();
    });
                
    function prova(){
        // qui (all'interno della funzione) vorrei poter catturare l'ID dell'elemento che scatena l'evento (in questo caso #id_tipo)
        var valore = $(this).attr("id");
        console.log(valore);
    };

  4. #4
    Ok, ho risolto così:
    codice:
    $('#id_tipo').change(function(event){
        prova();
    });
    
    function prova(){
        var valore = event.target.id;
        console.log(valore);
    };

    Ora però ho un altro problema: se aggiungo .change(); per eseguire automaticamente la funzione al caricamento della pagina, ottengo Uncaught TypeError: Cannot read property 'target' of undefine. Se invece scateno l'evento manualmente tutto ok:
    codice:
    $('#id_tipo').change(function(event){
        prova();
    }).change();

  5. #5
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,684
    Bene, ho capito l'intenzione, tuttavia non mi è chiaro il contesto in cui devi applicare questa roba quindi mi è difficile darti una risposta mirata. E' possibile risolvere in vari modi ma bisognerebbe aoppunto capire qual è il motivo per il quale vuoi richiamare la funzione prova() in quel modo.

    Teoricamente potresti applicare tale funzione direttamente come callback dell'evento in questione (al posto della funzione anonima che invece hai definito):

    codice:
    $('#id_tipo').change(prova);
                
    function prova(){
       var idElemento = this.id;
       console.log(idElemento);
    };
    In questo caso all'interno della funzione (direttamente richiamata per quell'evento) si ha un contesto riferito all'elemento stesso da cui è scaturito tale evento. In altre parole il this fa riferimento direttamente all'elemento in questione.

    Se invece vuoi richiamare la funzione dall'interno del callback, come stavi cercando di fare, puoi usare la funzione call() in modo da determinare uno specifico context.

    codice:
    $('#id_tipo').change(function(){
       prova.call(this);
    });
                
    function prova(){
       var idElemento = this.id;
       console.log(idElemento);
    };
    In modo simile puoi usare apply() se ti serve passare anche dei parametri alla funzione stessa.

    Vedi se può bastare quanto indicato tenendo conto che potrebbero esserci anche altri differenti modi per risolvere ma, ripeto, è difficile darti un suggerimento preciso senza conoscere la situazione in cui devi usare questo script nonché l'obiettivo finale che vorresti ottenere di preciso.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  6. #6
    Grazie mille per la risposta! Cercavo di sintetizzare la domanda per semplicità..
    Comunque ho creato una funzione che esegue una chiamata ajax solo passandogli un paio di parametri (puntamento alla pagina ajax e elemento in cui caricare i risultati) senza dover creare una chiamata ajax per ogni combo.

    Il motivo per cui ho bisogno di catturare l'ID dell'elemento che scatena l'evento è perché ho bisogno di trasferirne il suo valore in modo automatico nella pagina ajax:
    codice:
    $('#select1').change(function(event){
        prova("provaajax", "select2");
    }).change();
                
    function prova(url, dest){
        e = event.target.id;
        var id_rif = $("#"+e).val();
        $.ajax({
            type: "POST",
            url: url+".php",
            data: "id_rif=" + id_rif,
            dataType: "html",
            success: function(msg){
                $("#"+dest).html(msg);
            }
        });
    };

  7. #7
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,684
    Ok, quindi alla funzione prova(), da quel che vedo, devi poter passare comunque dei parametri.

    Domanda: non puoi semplicemente passare con un ulteriore parametro anche il riferimento all'elemento in questione?
    Potrebbe essere una cosa del genere:
    codice:
    $('#select1').change(function(){
        prova("provaajax", "select2", this); // this è il riferimento all'elemento #select1 in questo caso
    }).change();
                
    function prova(url, dest, elementoChiamante){
       
        console.log(elementoChiamante); // il riferimento all'elemento select
        console.log(elementoChiamante.value); // il valore dell'elemento select
        
        // a questo punto puoi recuperarne il valore e memorizzarlo ad  esempio in una variabile, anche senza dover ricostruire il selettore  jquery
        var valoreSelect = elementoChiamante.value;
        
        $.ajax({
            type: "POST",
            url: url+".php",
            data: "id_rif=" + valoreSelect,
            dataType: "html",
            success: function(msg){
                $("#"+dest).html(msg);
            }
        });
    };
    Ultima modifica di KillerWorm; 20-02-2019 a 20:34
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  8. #8
    Si potrei, ma siccome volevo ridurre al minimo gli argomenti della funzione (ecco lo scopo di questo topic.. quel "this" lo vedo ripetitivo e tra virgolette "fastidioso") pensavo di ricavarlo in automatico (dopo qualche ricerca ci sono riuscito con "event.target.id").
    Inizialmente facevo cosi:
    codice:
    $('#id_tipo').change(function(){
        prova($(this).attr("id"));
    });
    codice:
    function prova(e){
        var id = $("#"+e).val();
        ...
    };

  9. #9
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,684
    dopo qualche ricerca ci sono riuscito con "event.target.id"
    Quindi in questo modo ti funziona?

    Cosa credi che sia quel "event"? Non è altro che un parametro passato alla funzione di callback definita per il gestore di evento in questione.
    In sostanza si tratta di un oggetto che contiene tutte le varie proprietà restituite dal gestore di evento, tra cui "target" che hai usato in quel modo per recuperare il riferimento all'oggetto da cui è scaturito l'evento.

    Ma se devi richiamare un'ulteriore funzione, usando questo sistema comunque portare dietro quella variabile "event". A questo punto sarebbe più semplice portarsi dietro il semplice riferimento di this. Non credi?

    Si potrei, ma siccome volevo ridurre al minimo gli argomenti della funzione (ecco lo scopo di questo topic.. quel "this" lo vedo ripetitivo e tra virgolette "fastidioso")
    Senza offesa, presumo sia solo una tua fissazione ma in questo caso non vedo nessuna valida motivazione per ridurre il numero degli argomenti di quella funzione.

    Capisco che può essere difficile comprenderne certe logiche di funzionamento per un non esperto, ma i concetti come "contesto", "ambito", "area di validità delle variabili", sono concetti basilari della programmazione ad oggetti... JavaScript non ne fa eccezione; il tuo «quel "this" lo vedo ripetitivo» può essere motivato solo se hai ben chiari certi concetti.

    Ad ogni modo se leggi quanto ti ho indicato sopra, puoi adoperare il metodo apply() in modo che il context (e quindi il this) della funzione che vai ad eseguire faccia riferimento sempre all'elemento specificato per apply().

    Fai qualche prova e fai sapere.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.