RISOLTO Aiuto Con Jquery E Javascript!!

Pubblicità
J

joker320t

Nuovo Utente
Messaggi
73
Reazioni
1
Punteggio
27
Ciao ragazzi, ho riscontrato il seguente problema con JQuery, in poche parole devo creare un calendario e selezionando un giorno mi apre una finestra dove io mi posso prenotare per varie attività! Dove sta il problema? Allora cosi io creo i giorni del mese e gli assegno una classe ad ognuno.
Codice: 
var str = "";
    for(var i = 1; i <= 31; i++){
        if(i == giorno){
            str += "<li class='active'>" + i + "</li>";
        }else{
            str += "<li class='click'>" + i + "</li>";
        }

Poi io vorrei poter cliccare sul giorno quindi ho creato questa funzione in JQuery che purtruppo però non funziona su questi nuovi elementi che ho creato dinamicamente, ma funziona solo su elementi che ho scritto io sulla pagina html.

Codice: 
 $(document).ready(function(){
    $(".click").click(function(){
     alert("finally")
    });
});

Questa funzione quando clicco in teoria sull' elemento con class click dovrebbe mostrarmi una finestra di allert ma sfortunatamente non funziona, o meglio ripeto funziona solo su elementi che ho creato io sul foglio html. Spero riusciate a darmi una diritta perchè gi ho gia perso troppo tempo e sto impazzendo. Grazie mille in anticipo.
 
Per come hai scritto il codice la funzione viene eseguita solo sugli elementi che hanno classe .click, quelli che crei con classe .active non faranno niente.
 
Grazie per la risposta, certo lo so, però non funziona neanche su quelli con classe click?!?!
Se io per esempio creassi un div e gli aggiungo id o classe "contenitore" e nella funzione gli metto contenitore funziona tutto, ma se io gli metto click che e' una classe creata dinamicamente con js non funziona come mai??
 
Ultima modifica:
joker320t ha detto:
Grazie per la risposta, certo lo so, però non funziona neanche su quelli con classe click?!?!
Se io per esempio creassi un div e gli aggiungo id o classe "contenitore" e nella funzione gli metto contenitore funziona tutto, ma se io gli metto click che e' una classe creata dinamicamente con js non funziona come mai??
Clicca per espandere...

Dipende molto dal codice, riesci a metterlo tutto ?
O, perlomeno, lo html gia' creato e la parte javascript che crei dopo.

Potrebbe essere un problema di ordine nella creazione delle cose...
 
HTML: 
<!DOCTYPE html>
<html>
<head>
    <title>Calendario</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <link href="css/calendario_style.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="script/acion_calendar.js"></script>
</head>
<body>
    <p id="stampa"></p>
    <div id="calendario">
        <div class="mesi">
            <ul>
                <li class="pre">&#10094;</li>
                <li class="next">&#10095;</li>
                <li id="mese"></li>
            </ul>
        </div>
           
            <ul id="giorni_settimana">
                <li>Lun</li>
                <li>Mar</li>
                <li>Mer</li>
                <li>Gio</li>
                <li>Ven</li>
                <li>Sab</li>
                <li>Dom</li>
            </ul>   
           
            <ul id="giorni"></ul>
    </div>
</body>
</html>

JavaScript: 
var mesi = [
    "gennaio",
    "febbraio",
    "marzo",
    "aprile",
    "maggio",
    "giugno",
    "luglio",
    "agosto",
    "settembre",
    "ottobre",
    "novembre",
    "dicembre"
];

var data = new Date();
var giorno = data.getUTCDate();
var mese = data.getMonth();
var anno = data.getFullYear();

window.onload = function(){
    document.getElementById("mese").innerHTML = mesi[mese] + "<br> <span style='font-size:18px;'>" + anno + "</span>"
    var str = "";
    for(var i = 1; i <= 31; i++){
        if(i == giorno){
            str += "<li class='active'>" + i + "</li>";
        }else{
            str += "<li class='click'>" + i + "</li>";
        }
    }
   
    document.getElementById("giorni").innerHTML = str;
    //document.getElementById("active").classList.add("active");
}
$(document).ready(function(){
    $(".click").click(function(){
     alert("finally")
    });
});
 
Ci sono due cose da provare :
1) il codice che e' nella window.onload, eseguito come prima cosa nella $(document).ready
2) incorporare la gestione dell'evento onClick nella str += "<li class='click'>" + i + "</li>";
 
Mursey ha detto:
Ci sono due cose da provare :
1) il codice che e' nella window.onload, eseguito come prima cosa nella $(document).ready
2) incorporare la gestione dell'evento onClick nella str += "<li class='click'>" + i + "</li>";
Clicca per espandere...
Grazie inanzi tutto per la risposta, sono riuscito a risolvere prima mettendo tutto dentro $(document).ready credo che il problema stava che la funzione jquery la mettevo fuori dalla funzione e quindi non riusciva a vedere gli elementi.. un altra domanda c'e un modo per capire il numero tra <li></li> quando clicco sopra o devo perforza attribuirgli ad ogni elemento l'attributo value="numero"?
 
joker320t ha detto:
Grazie inanzi tutto per la risposta, sono riuscito a risolvere prima mettendo tutto dentro $(document).ready credo che il problema stava che la funzione jquery la mettevo fuori dalla funzione e quindi non riusciva a vedere gli elementi.. un altra domanda c'e un modo per capire il numero tra <li></li> quando clicco sopra o devo perforza attribuirgli ad ogni elemento l'attributo value="numero"?
Clicca per espandere...


il priblema di fondo era che la jQuery(document).ready viene eseguita prima della Windows.onload.
 
Pubblicità
Pubblicità
Indietro
Top