Передача PHP переменных в JavaScript

Question

Передача PHP переменных в JavaScript

19 апр. 2013 г., 01:02:53

Просмотры: 21.5K

Голосов: 17

Есть ли возможность передать некоторые PHP переменные в JavaScript, чтобы я мог использовать их позже?

Только в single.php.
Я слышал про wp_enqueue_scripts, но с ним необходимо указывать путь к JS файлу, а он мне не нужен.

Sebastian Corneliu Vîrlan

293

плагины разработка плагинов страницы jquery шаблоны

Комментарии

Что ты имеешь в виду под позже, и где ты хочешь использовать переменные (по отношению к тому, где находятся PHP-переменные)? Ты, конечно, можешь выводить/печатать JavaScript-код через PHP и таким образом вставлять значения PHP-переменных. Но, полагаю, это не то, что тебе нужно...

tfrommen

19 апр. 2013 г. 01:17:47

Я создал новую таблицу в БД с некоторыми response.id из API Facebook. Вот структура таблицы: action_id, user_id, post_id, fb_id, где fb_id — это response.id из действия Facebook. Затем в single.php у меня есть кнопка, при нажатии на которую нужно удалить действие через API: FB.api('/'+fb.response, 'delete'); где fb.response должен быть fb_id из таблицы.

Sebastian Corneliu Vîrlan

19 апр. 2013 г. 01:23:40

Все ответы на вопрос

Комментарии

Я только начинаю в этом разбираться, поэтому пытаюсь внедрить это в свой WordPress: http://papermashup.com/jquery-iphone-style-ajax-switch/. Как видите, там есть js-файл и несколько строк js-кода, которые нужно добавить в файл использования. Или я могу поместить эти несколько строк кода в другой файл?

Sebastian Corneliu Vîrlan

19 апр. 2013 г. 01:30:48

Значит, для любого небольшого действия на javascript я должен создавать файл? Если вы свободны, можете добавить меня в Skype: sebyku17?

Sebastian Corneliu Vîrlan

19 апр. 2013 г. 01:40:58

Это зависит от того, что именно вы хотите сделать, где вы хотите это реализовать и так далее. В общем случае: нет, вам не обязательно использовать внешний JS-файл. Но если вы решите его использовать, вы можете поместить всё, что угодно, в один единственный файл. Нет необходимости создавать несколько файлов, если у вас несколько функций, если это был ваш вопрос. Однако вы уже приняли этот (по моему скромному мнению, довольно сложный и в вашем случае слегка избыточный) ответ — не до конца его поняв, как я понимаю. Без обид, @Johannes. ;)

tfrommen

19 апр. 2013 г. 01:45:33

В конечном итоге это сводится к личным предпочтениям, полагаю. Но одно можно сказать точно: чем больше становится ваша кодовая база, тем сложнее будет читать её в будущем, и тем важнее поддерживать её в чистоте. Лично я не люблю, когда серверный и клиентский код находятся в одном файле — за исключением некоторых случаев, конечно. Простую однострочную функцию onclick действительно можно оставить инлайн, но тогда вы теряете преимущества wp_localize_script.

Johannes Pille

19 апр. 2013 г. 01:46:08

Вот моя страница: http://funny-videoro.com/the-dark-knight-rises-trailer-oficial/. После нажатия на плеер и входа в систему, внизу плеера есть кнопка. При нажатии на "выключить" должно удаляться сообщение в Facebook. Я попробую вынести все функции в отдельный js-файл. Надеюсь, это сработает.

Sebastian Corneliu Vîrlan

19 апр. 2013 г. 01:49:13

Показать остальные 9 комментариев

https://developer.wordpress.org/reference/functions/wp_add_inline_script/ в настоящее время является предпочтительным вариантом

РЕДАКТИРОВАТЬ: Из документации выше:

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' );

Таким образом, сначала подключается скрипт, а затем передаются переменные

Однако этот код просто генерирует следующее

<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>

В моем случае я просто передаю необходимые данные, напрямую записывая JavaScript-код (в шаблоне) и используя глобальную JS-переменную с определенным именем (лучшего способа не нашел) (используя Timber, чистый PHP должен быть эквивалентен)

<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 июл. 2020 г. 18:46:11

Комментарии

Я согласен с вашей оценкой, но ответы должны быть самодостаточными, а не только ссылкой. Не могли бы вы добавить пример и объяснение?

Nicolai Grossherr

20 июл. 2020 г. 19:12:21

абсолютно верно

GWorking

20 июл. 2020 г. 19:57:14

Прочитав ваш комментарий, я понимаю, что вы хотели бы сделать что-то вроде этого:

// Получить ID каким-либо способом
$facebook_id = ...

// Создать и вывести кнопку
echo '<input onclick="FB.api(\'/\'+'.$facebook_id.', \'delete\')" />';

tfrommen

9.23K

19 апр. 2013 г. 01:29:52

Комментарии

Нет, это страница, над которой я работаю: http://funny-videoro.com/the-dark-knight-rises-trailer-oficial/. Если хотите, вы можете войти на сайт. Затем вы увидите кнопку в стиле jQuery ios. Когда я сдвигаю её в положение "выкл", мне нужно удалить публикацию через API Facebook. ID публикации находится в базе данных.

Sebastian Corneliu Vîrlan

19 апр. 2013 г. 01:35:19

Ну, это, по сути, то, что я написал в своём ответе. Получите id из базы данных и сохраните его в переменной. Затем напрямую выведите его в вызов вашей однострочной JavaScript-функции. <input ... /> и его функция были только для демонстрации. Насколько я понял, здесь сказано всё, что вам нужно. Если нет, пожалуйста, попробуйте объяснить подробнее, но в своём вопросе, а не в комментариях.

tfrommen

19 апр. 2013 г. 01:39:10

Я не хочу использовать php и js код в одной строке, в WordPress есть автоматические функции...

Sebastian Corneliu Vîrlan

19 апр. 2013 г. 02:24:58

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

Лучший метод на практике

Ознакомьтесь с функцией wp_localize_script, которая создана именно для этого.

Но она требует предварительного использования wp_enqueue_scripts, поэтому вам действительно нужно будет перенести ваш JS в отдельный файл.
Однако эти несколько минут усилий определенно того стоят.

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

        wp_register_script(
           'your_script_handle',
           get_template_directory_uri() . '/js/your-script.js',
           array( /* зависимости */ ),
           1.0,
           true
       );

       wp_enqueue_script( 'your-script-handle' );

       $script_params = array(
           /* примеры */
           'post' => 99,
           'users' => array( 1, 20, 2049 )
       );

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

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

В JS вы затем сможете использовать переданные параметры следующим образом:

var posts = scriptParams.post,
    secondUser = scriptParams.users[1]; /* индекс начинается с 0 */

// перебор пользователей
for ( var i = 0; i < scriptParams.users.length; i++ ) {
    alert( scriptParams.users[i] );
}

[Редактирование] Ваша ситуация

Согласно вашему комментарию

Я создал новую таблицу в БД с некоторыми response.id из API Facebook. Вот структура таблицы: action_id, user_id, post_id, fb_id, где fb_id — это response.id из действия Facebook. Затем в single.php у меня есть кнопка, при нажатии на которую нужно удалить действие Facebook через API: FB.api('/'+fb.response, 'delete');, где fb.response должен быть fb_id из таблицы.

Поместите следующий код в папку /js/ вашей темы. Создайте её, если она не существует.
Назовём файл fb-response.js:

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

Затем зарегистрируйте, подключите и локализуйте, как показано выше. Предположим, что ID, который вы хотите передать, хранится в переменной $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 ) );

Примечание: Очевидно, что вышеприведенный код предполагает работу в теме. Если речь идет о плагине, измените пути соответствующим образом.