Passare variabili PHP a JavaScript

Question

Passare variabili PHP a JavaScript

19 apr 2013, 01:02:53

Visualizzazioni: 21.5K

Voti: 17

È possibile passare delle variabili PHP a JavaScript per poterle utilizzare successivamente?

Solo nel file single.php.
Ho sentito parlare di wp_enqueue_scripts ma con quello è necessario dichiarare un percorso a un file JS, che non mi serve.

Sebastian Corneliu Vîrlan

293

plugin sviluppo plugin pagine jquery template

Commenti

Cosa intendi con più tardi, e dove vuoi utilizzare le variabili (rispetto a dove si trovano le variabili PHP)? Puoi certamente echo/print codice JavaScript tramite PHP, e quindi inserire i valori delle variabili PHP. Ma immagino non sia questo che vuoi...

tfrommen

19 apr 2013 01:17:47

Ho creato una nuova tabella nel db con alcuni response.id dell'API di Facebook. Questa è la tabella: action_id, user_id, post_id, fb_id dove fb_id è response.id da un'azione di Facebook. Poi in single.php ho un pulsante che quando premo deve eliminare l'azione fb con l'api: FB.api('/'+fb.response, 'delete'); dove fb.response dovrebbe essere fb_id dalla tabella.

Sebastian Corneliu Vîrlan

19 apr 2013 01:23:40

Tutte le risposte alla domanda

Commenti

Sono un po' principiante in questo, quindi sto cercando di implementare questo nel mio WordPress: http://papermashup.com/jquery-iphone-style-ajax-switch/. Come puoi vedere c'è un file js e poche righe di codice js da inserire nel file di utilizzo. Oppure posso mettere quelle poche righe di codice in un altro file?

Sebastian Corneliu Vîrlan

19 apr 2013 01:30:48

Quindi per ogni piccola azione javascript dovrei creare un file? Se sei disponibile puoi aggiungermi su Skype: sebyku17 ?

Sebastian Corneliu Vîrlan

19 apr 2013 01:40:58

Dipende da cosa vuoi fare, dove vuoi farlo, e così via. In generale: No, non devi usare un file JS esterno. Ma se scegli di farlo, puoi mettere quello che vuoi all'interno di un singolo file. Non c'è bisogno di più file se hai più funzioni, se è questo che stavi chiedendo. Tuttavia, hai già accettato questa (IMO piuttosto complessa e nel tuo caso leggermente eccessiva sorta di) risposta - senza averla pienamente compresa, come ho capito. Nessuna offesa, @Johannes. ;)

tfrommen

19 apr 2013 01:45:33

Beh, alla fine si riduce a una questione di preferenze personali, immagino. Ma una cosa è certa: più grande diventa la tua codebase, più difficile sarà leggerla in seguito, e più importante sarà mantenerla pulita. Io, personalmente, non mi piace avere codice lato server e lato client nello stesso file - con delle eccezioni, ovviamente. Una semplice riga con onclick può certamente essere lasciata inline, ma rinunci anche alla potenza di wp_localize_script.

Johannes Pille

19 apr 2013 01:46:08

Questa è la mia pagina: http://funny-videoro.com/the-dark-knight-rises-trailer-oficial/, dopo aver premuto sul player e fatto il login, in fondo al player c'è un pulsante, quando premi per spegnere dovrebbe cancellare il post su Facebook. Proverò a creare un file js per tutte le funzioni. Spero funzionerà.

Sebastian Corneliu Vîrlan

19 apr 2013 01:49:13

Mostra i restanti 9 commenti

https://developer.wordpress.org/reference/functions/wp_add_inline_script/ dovrebbe essere l'opzione preferita al giorno d'oggi

MODIFICA: Dalla documentazione sopra:

function mytheme_enqueue_typekit() {
   wp_enqueue_script( 'mytheme-typekit', 'https://use.typekit.net/.js', array(), '1.0' );
   wp_add_inline_script( 'mytheme-typekit', 'try{Typekit.load({ async: true });}catch(e){}' );
}
add_action( 'wp_enqueue_scripts', 'mytheme_enqueue_typekit' );

Quindi prima si accoda lo script, e poi si passano le variabili

Tuttavia questo codice genera semplicemente quanto segue

<script type="text/javascript" src="https://use.typekit.net/.js?ver=1.0"></script>
<script type="text/javascript"> try{Typekit.load({ async: true });}catch(e){} </script>

Nel mio caso, espongo semplicemente i dati di cui ho bisogno scrivendo direttamente il codice JavaScript (nel template) e usando una variabile globale JS con un nome specifico (non ho trovato un modo migliore) (usando Timber, in PHP puro dovrebbe essere equivalente)

<script>
    my_global_variable.data1 = {{ custom_timber_function()|json_encode }}
</script>

$twig->addFunction(new Timber\Twig_Function('custom_timber_function', function () {
    return [
      'theme' => get_stylesheet_directory_uri(),
    ];
}));

GWorking

165

20 lug 2020 18:46:11

Commenti

Sono d'accordo con la tua valutazione, ma le risposte dovrebbero essere autonome e non solo un link. Puoi aggiungere un esempio e una spiegazione, per favore?

Nicolai Grossherr

20 lug 2020 19:12:21

assolutamente corretto

GWorking

20 lug 2020 19:57:14

Avendo letto il tuo commento, capisco che vorresti fare qualcosa del genere:

// Fai qualcosa per ottenere l'ID
$facebook_id = ...

// Crea e stampa il pulsante
echo '<input onclick="FB.api(\'/\'+'.$facebook_id.', \'delete\')" />';

tfrommen

9.23K

19 apr 2013 01:29:52

Commenti

No, questa è la pagina su cui sto lavorando: http://funny-videoro.com/the-dark-knight-rises-trailer-oficial/. Se vuoi puoi accedere al sito. Poi vedrai un pulsante in stile iOS con jQuery. Quando lo scorro su off devo eliminare con l'API di Facebook un post. L'ID del post è nel database.

Sebastian Corneliu Vîrlan

19 apr 2013 01:35:19

Beh, questo è fondamentalmente ciò che ho scritto nella mia risposta. Recupera l'ID dal database e memorizzalo in una variabile. Poi stampalo direttamente nella tua chiamata JavaScript su una riga. Il <input ... /> e la sua funzione erano solo a scopo dimostrativo. Per come ho capito, è già stato detto tutto ciò di cui hai bisogno. Se non è così, per favore cerca di spiegare meglio, ma nella tua domanda, non nei commenti.

tfrommen

19 apr 2013 01:39:10

Non voglio usare codice PHP e JS sulla stessa riga, in WordPress ci sono alcune funzioni automatiche...

Sebastian Corneliu Vîrlan

19 apr 2013 02:24:58

Johannes Pille 11.1K · Accepted Answer · 2013-04-19T01:21:13Z

Metodo delle migliori pratiche

Dai un'occhiata a wp_localize_script, che è proprio progettato per fare questo.

Ma richiede l'uso precedente di wp_enqueue_scripts, quindi dovrai spostare il tuo JS in un file separato.
Varrà sicuramente la pena dedicare quei pochi minuti di sforzo.

function wpse_96370_scripts()
{
    if ( is_single() ) {

        wp_register_script(
           'your_script_handle',
           get_template_directory_uri() . '/js/your-script.js',
           array( /* dipendenze */ ),
           1.0,
           true
       );

       wp_enqueue_script( 'your-script-handle' );

       $script_params = array(
           /* esempi */
           'post' => 99,
           'users' => array( 1, 20, 2049 )
       );

       wp_localize_script( 'your-script-handle', 'scriptParams', $script_params );

    }
}
add_action( 'wp_enqueue_scripts', 'wpse_96370_scripts' );

Nel JS potrai poi utilizzare i parametri passati in questo modo:

var posts = scriptParams.post,
    secondUser = scriptParams.users[1]; /* l'indice parte da 0 */

// scorri gli utenti
for ( var i = 0; i < scriptParams.users.length; i++ ) {
    alert( scriptParams.users[i] );
}

[Modifica] La tua situazione

Come da tuo commento

Ho creato una nuova tabella nel db con alcuni response.id dell'api di facebook. Questa è la tabella: action_id, user_id, post_id, fb_id dove fb_id è response.id da un'azione facebook. Poi in single.php ho un pulsante che, se premuto, deve eliminare l'azione fb con l'api: FB.api('/'+fb.response, 'delete'); dove fb.response dovrebbe essere fb_id dalla tabella.

Inserisci quanto segue nella cartella /js/ del tuo tema, creala se non esiste.
Chiamiamo il file fb-response.js:

jQuery( '#button_id' ).click( function() {
    FB.api( '/' + fbParams.id, 'delete' );
});

Quindi registra, accoda e localizza come visto sopra. Supponendo che tu abbia l'ID che vuoi passare in, diciamo, $fb_id:

wp_register_script(
    'fb-response',
     get_template_directory_uri() . '/js/fb-response.js',
     array( 'jquery' ),
     1.0,
     true
);

wp_enqueue_script( 'fb-response' );

wp_localize_script( 'fb-response', 'fbParams', array( 'id' => $fb_id ) );

N.B. Ovviamente, quanto sopra presuppone che questo sia in un tema. Se stiamo parlando di un "plugin", modifica le posizioni di conseguenza.