Visualizzazione risultati 1 fino 7 di 7

Discussione: [JQuery] Selezionare l'ultimo elemento

  1. #1
    Guest

    Predefinito [JQuery] Selezionare l'ultimo elemento

    Ciao a tutti, ho una serie di bottoni devo fare in modo che selezionando l'ultimo bottone mi crea un bottone successivo...
    es.
    Codice PHP:
    <!DOCTYPE html>
    <
    html>
    <
    head>
    <
    script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
    $(function(){
    var response = 0;

    for(var i=1;i<4;i++){
    $(".s").append('<button type="button" class="button_'+i+'">'+i+'</button>');
    }
    response = 3;

    $(document).on("click", ".button_"+response, function(){
    if(response < "10"){
    response++;
    $(".s").append('<button type="button" class="button_'+response+'">'+response+'</button>');
    }
    });

    });
    </script>
    </head>
    <body>

    <div class="s"></div>

    </body>
    </html>

  2. #2
    L'avatar di EuroSalute
    EuroSalute non è connesso AlterVistiano
    Data registrazione
    12-05-2003
    Messaggi
    969

    Predefinito

    Guarda se è quello che vorresti fare, provalo:

    Codice HTML:
    <script>
    
    $(function(){
    
    var response = 3;
    var s=$(".s",this);
    
    for(var i=1;i<=response;i++){
    $(".s").append('<input type="button" value="'+i+'" class="s_button">');
    }
    
    var s_button=$(".s .s_button",this);
    
    //$([s.get(0)]).bind("click", function(){
    $([s_button.get(2)]).bind("click", function(){
    
    if (response<10){
    response++;
    
    //test:
    alert(s_button.attr("value")+' | '+response);
    
    $(".s").append('<input type="button" value="'+response+'" class="s_button">');
    }
    
    });
    
    
    });
    
    </script>
    LOTTO MATEMATICO-SCENTIFICO che FUNZIONA:
    Scripts di Calcolo Automatico Metodologie http://eurosalute.altervista.org

    VINCI OGNI SETTIMANA CON IL NUOVO METODO 5
    FAI IL TEST CON L'ANALISI VINCITE

  3. #3
    Guest

    Predefinito

    Ti ringrazio di aver risposto, io volevo fare in modo che premendo sull'ultimo pulsante venga creato un nuovo pulsante...
    es.
    Ho 3 pulsanti, premo sul terzo pulsante viene creato il quarto pulsante cliccando sul quarto pulsante dovrebbe crearsi il quinto e cosi via...

  4. #4
    Guest

    Predefinito

    Sono contrario al codice pronto ma ...

    ...prova questo:

    Codice PHP:
    <!DOCTYPE html>
    <
    html>
    <
    head>
    <
    script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
    var e = 0;

    function crea(nr, el) {
    for(var c = 0; c < nr; c++) {
    e++;
    $('#' + el).append('<button type="button" class="miaclasse" id="btn_' + e + '">' + e + '</button>');
    }
    }

    $(document).ready(function(){
    crea(3, 's');

    $(document).click(function(event) {
    var tgt = $(event.target);

    if($(tgt).hasClass('miaclasse')) {
    if( $(tgt).attr('id') == 'btn_' + e) {
    crea(1, 's');
    }
    }
    });
    });

    </script>
    </head>
    <body>

    <div id="s"></div>

    </body>
    </html>
    Non capisco come usi l'attributo class. Non ha senso dare una classe diversa ad ogni elemento (unione del contatore). Semmai usa ID.
    Ultima modifica di simpleticket : 10-08-2012 alle ore 11.47.48

  5. #5
    Guest

    Predefinito

    Ti ringrazio funziona, una cosa modificando lo script in questo modo...

    Codice PHP:
    <!DOCTYPE html>
    <
    html>
    <
    head>
    <
    script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
    var e = 0;

    function Make_input(nr,el){
    for(var c=0;c<nr;c++){ e++;
    $('#'+el).append('<input type="text" class="miaclasse" id="btn_'+e+'" value="btn_'+e+'"><br>');
    }}

    $(document).ready(function(){

    Make_input(3,'s');
    $(document).click(function(event){
    if(e < "10"){
    var tgt = $(event.target);
    if($(tgt).hasClass('miaclasse')){
    if($(tgt).attr('id') == 'btn_' + e){
    Make_input(1,'s');
    }}}});

    $(document).focus(function(event){
    if(e < "10"){
    var tgt = $(event.target);
    if($(tgt).hasClass('miaclasse')){
    if($(tgt).attr('id') == 'btn_' + e){
    Make_input(1,'s');
    }}}});

    });
    </script>
    </head>
    <body>

    <div id="s"></div>

    </body>
    </html>
    Non capisco perché applicando il focus non viene creato l'elemento.
    p.s.
    Mi potresti spiegare questa parte...
    Codice PHP:
    var tgt = $(event.target);

  6. #6
    Guest

    Predefinito

    Ecco perchè la pappa pronta fa male.

    Utilizzare codice bello e pronto e, soprattutto, modificarlo senza sapere che si fa, produce danno.
    Quando chiedi cosa vuol dire una riga (var tgt = $(event.target);) dimostri in pieno di non aver capito tutto il resto.

    Dunque, essendo la pagina creata dinamicamente (lato client, quindi con interventi JS sul DOM), non per avere l'effetto richiesto (il listener solo sull'ultimo elemento di una serie) dovresti, ad ogni modifica, togliere il listener per l'oggetto che l'aveva e riassegnarlo al nuovo "ultimo".
    Per evitare ciò, ti avevo proposto una applicazione della coseddetta event delegation, ovvero catturare l'evento (click) sul documento, e solo qualora il click sia fatto su uno specifico elemento (il target) allora accadeva un qualcosa (aggiunta di un elemento).

    Ora se avessi capito questo, non avresti neppure pensato a fare la moficia che hai fatto, in quanto l'evento focus sul documento ce lo hai sempre, il documento, in pratica, non perde mai il focus quandi non si verificherà mai il nuovo e quindi l'azione collegata.

    Se il tuo scopo era quello di aggiungerlo al focus (che poi non capisco il perchè, visto che potresti selezionare il campo e poi lasciarlo senza scrivere nulla e allora? Cancelli il nuovo campo creato e ricrei tutti i listener?), tutta la costruzione non va più bene.

    Ma questa volta, sta a te provare una strada ...

  7. #7
    Guest

    Predefinito

    Mi spiego bene, ho 3 campi input.
    Se clicco o applico l'effetto focus sui primi 2 campi non dovrebbe succedere niente, se clicco o applico l'effetto focus sull'ultimo campo cioè il 3 anche se è vuoto dovrebbe crearmi un altro campo cosi a susseguirsi fino a quanto i campi non sono 10.
    Cioè i due eventi click e focus devo essere applicati solo sull'ultimo campo, come posso togliere il listener sull'ultimo campo e assegnarlo al nuovo campo creato?
    Ed infine il decimo campo non dovrebbe più avere il listener...

    Mi potresti dare una mano... ;)

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •