Получение элемента класса тела и превращение его в переменную PHP - PullRequest
Новая
       6

Получение элемента класса тела и превращение его в переменную PHP

0 голосов
/ 25 февраля 2012

Я создаю новый сайт с использованием методов адаптивного дизайна и в основном с использованием CSS Media Queries, и это сработало очень хорошо.Однако в некоторых случаях мне нужно получить ширину браузера, и я делаю это, добавляя класс <html> с этим изящным битом для JQuery: 

    (function($) {
        //add drupal 7 specific code
        Drupal.behaviors.getWidthTheme = {
            attach: function(context, settings) {
                //end drupal calls

var w, html = $('html'), _window = $(window);
 _window.resize(onResize);
function onResize() {
w = _window.width();
if (w >= 310 && w < 480 )  html.addClass('mobile-320').removeClass('mobile-768').removeClass('desktop').removeClass('mobile-480');
else if (w >= 481 && w < 768 )  html.addClass('mobile-480').removeClass('mobile-768').removeClass('desktop').removeClass('mobile-320');
else if ( w >= 768 && w < 960 ) html.addClass('mobile-768').removeClass('mobile-480').removeClass('desktop').removeClass('mobile-320');
else html.addClass('desktop').removeClass('mobile-480').removeClass('mobile-768').removeClass('mobile-320');
                }
onResize();

            }}})(jQuery);

Приведенный выше код вводит класс в <html> элемент, например <html class="mobile-320"> и т. д. ... в зависимости от ширины браузера или устройства.

Я хотел бы взять этот класс и каким-то образом преобразовать его в переменную PHP, чтобы я мог отключить некоторый код.В идеале это было бы примерно так: 

<?php if ($mobile-320): ?>
<!--do something-->
<?php else : ?>

<?php if ($mobile-480 || $mobile-768 || $desktop): ?>
<!-- do some other thing -->
<?php endif;  ?>

В идеале эти классы извлекаются из класса HTML, который был отрендерен.Тем не менее, я не уверен, что это может работать, так как PHP должен отображаться на сервере, тогда как я внедряю класс HTML через JQuery.Я в принципе открыт для любого способа сделать это, не основываясь на том, что у меня есть выше, но, надеюсь, вы поняли идею.

Ответы [ 2 ]

1 голос
/ 25 февраля 2012

Вы можете поместить все классы в массив и передать этот массив в data: 

var classes = $('html').attr('class').match(/\w+/g);
$.ajax({
    type: 'post',
    url: 'url.php',
    data: {
        classes: classes
    }
    success: function() {
        // Blabla
    }
});

Кстати, ваш первый кусок кода может быть сокращен, если у вас есть только эти классы в $('html'): 

if (w >= 310 && w < 480 ) { html.removeClass().addClass('mobile-320'); }
1 голос
/ 25 февраля 2012

Я не совсем уверен, что понимаю, но, возможно, вы можете запустить другой ajax-запрос, отправив имя только что вставленного класса. ответ php может быть json-data для управления тем, что вам нужно выполнить дальше, или это может быть html / javascript напрямую. это поможет увидеть больше вашего html / javascript. 

$.getJSON('getDeviceActions.php',
  { className: $('html').attr('class') }, 
  function(phpResult){
     if( phpResult.switchOffA == true ) $('.divsel').hide(); //or what not
  }
});

Почему вы не можете сделать свое заявление о переключении непосредственно в javascript, не спрашивая сервер, и что оно собирается делать с информацией после этого?

...