Compartiendo variables JS en múltiples bloques <script>

Estoy trabajando en una aplicación CodeIgniter.Compartiendo variables JS en múltiples bloques <script>

Tengo una vista, vamos a llamarlo Calendario, que tiene un bloque JS/jQuery <script> en él. Se ve así:

$(document).ready(function() { 

     $("#day_list").fadeIn(600); 

     // init 
     var current_month = <?= $init['current_month']; ?>; 
     var current_year = <?= $init['current_year'] ?>; 

     // previous, next month ajax call 
     $(".previous, .next").click(function(event) { 
      // do stuff to these variables, then ajax call. 
      $.ajax({ 
       // ajax 
      }); 
     }); 
    });

En otro punto de vista, mi pie de página, tengo otro bloque de script que debe utilizar las mismas variables (current_month y CURRENT_YEAR). Sin embargo, no sabe acerca de su existencia. ¿Cuál sería la forma más rápida y fácil de pasar estas variables desde el primer bloque <script> al otro? No puedo unir los dos bloques debido a la forma en que se compila mi aplicación. ¿Debo simplemente escribir una función que obtenga y devuelva estos valores (y cómo debo hacer esto? Soy un novato) o ¿hay alguna manera más fácil?

¡Muchas gracias!

Fuente

2011-04-25 cabaret

Es muy importante aprender a poner espacios de nombre a sus variables en JavaScript. El alcance importa, y eso importa mucho. En este momento, porque estás usando la palabra clave "var", tus cosas estarán en el ámbito local.

Algunas de las otras respuestas aquí dicen que debes moverlas al ámbito global. Eso funciona, a menos que algo más los sobrescriba involuntariamente. Estoy muy en desacuerdo con este enfoque, las variables con ámbito global son malas prácticas en JavaScript.

namespacing funciona así:

var foo = foo || {} //Use existing foo or create an empty object. 
foo.bar = foo.bar || {} 
foo.bar.baz = foo.bar.baz || {}

etc etc

Esto puede parecer mucho más trabajo, sino que también protege sus variables.

También puede agregar una función de espacio de nombres simple que espacio de nombres seguro todo contra el objeto ventana.(Cribste esto desde algún lugar hace años, y creo que lo modifiqué un poco, pero tal vez no).

poner esto en la parte superior de su aplicación y se puede namespace cosas con $ .namespace ("myapp.mydata") y luego dicen myapp.mydata.currentYear = ...

$.namespace = function() { 
    var a=arguments, o=null, i, j, d; 
    for (i=0; i<a.length; i=i+1) { 
     d=a[i].split("."); 
     o=window; 
     for (j=0; j<d.length; j=j+1) { 
      o[d[j]]=o[d[j]] || {}; 
      o=o[d[j]]; 
     } 
    } 
    return o; 
};

Además, si Eres nuevo, o quieres ser hardcore, te recomiendo leer JavaScript Good Parts de Crockford.

Fuente

2011-04-25 17:54:15 JSager

Gracias. Definitivamente intentaré esto una vez que me ajuste a mi concepto. Gracias por recomendar el libro. He querido comprar un libro, pero hay tantos, jaja. ¡Gracias! – cabaret

Sin problema The Good Parts es considerado por muchos como el libro definitivo sobre el lenguaje JavaScript. – JSager

Declara las variables como globales. Solo muévalos fuera de la función lista para documentos.

var current_month = <?= $init['current_month']; ?>; 
var current_year = <?= $init['current_year'] ?>; 

$(document).ready(function() { 
.... 
});

current_month y current_year ahora se puede acceder desde cualquier bloque de script.

Fuente

2011-04-25 17:44:45 Brad

¡Doh, gracias! – cabaret

ah .... buenas gracias. También tuvo que moverlo fuera de (función ($) {}) (jQuery); envoltura. – Andrew

Si declara sus variables fuera de cualquier bloque de funciones, serán variables globales, disponibles para cualquier script en la página.

var current_month; 
var current_year; 

$(document).ready(function() { 

    // init 
    current_month = <?= $init['current_month']; ?>; 
    current_year = <?= $init['current_year'] ?>; 

    ...etc... 

});

Fuente

2011-04-25 17:44:58 Geoff

Dado que var ha declarado estas variables dentro de una función, tienen alcance local. Moverlos fuera para hacerlos mundial:

// init 
var current_month = <?= $init['current_month']; ?>; 
var current_year = <?= $init['current_year'] ?>; 

$(document).ready(function() { 

    $("#day_list").fadeIn(600); 

    // previous, next month ajax call 
    $(".previous, .next").click(function(event) { 
     // do stuff to these variables, then ajax call. 
     $.ajax({ 
      // ajax 
     }); 
    }); 
});

La mejor solución que tiene variables globales es almacenarlos semánticamente en el código HTML, y luego recuperarlos a través de jQuery:

<body data-month="<?= $init['current_month']; ?>" data-year="<?= $init['current_year'] ?>"> 

$(document).ready(function() { 
    $("#day_list").fadeIn(600); 

    var current_month = $("body").data("month"); 
    var current_year = $("body").data("year"); 

    // previous, next month ajax call 
    $(".previous, .next").click(function(event) { 
     // do stuff to these variables, then ajax call. 
     $.ajax({ 
      // ajax 
     }); 
    }); 
});

Fuente

2011-04-25 17:45:30 Eli

Un desarrollador front-end que es principalmente un estilista web, siempre es tentador hacer esto, depositar sus variables JS en el HTML para su posterior recuperación, pero ¿es * realmente * una solución buena y sostenible? –

Los "var" inicia declaración Ambas variables (current_month, current_year) en el alcance de la función lista - por lo tanto, no están disponibles en ninguna otra parte. Puede declararlos globalmente:

var current_month; 
var current_year; 
$(document).ready(function() { 
    ... 
    current_month = ... 
}

De esta manera puede usarlos en la secuencia de comandos inferior.

Fuente

2011-04-25 17:45:33 cweiske

Compartiendo variables JS en múltiples bloques <script>

Respuesta

Cuestiones relacionadas