Переупорядочить Magento JavaScript Включает (addJs) - PullRequest
8 голосов
/ 06 сентября 2011

Я буду держать это просто .... на страницах моих продуктов мне нужно удалить файл prototype.js и заменить его последней версией prototype. До сих пор с помощью local.xml я успешно заменил его с помощью этого:

<action method="removeItem"><type>js</type><name>prototype/prototype.js</name></action>
<action method="addJs"><script>prototype/prototype-new.js</script></action>

Проблема в том, что теперь прототип загружается ниже всего, что включает в себя, что останавливает его работу.

Есть ли способ установить порядок JavaScript, включающий использование local.xml, без необходимости снова удалять и добавлять каждый отдельный файл?

Ответы [ 7 ]

44 голосов
/ 26 октября 2012

Вы можете использовать элемент params с HTML-атрибутом «data-group», Magento будет помещать элементы с установленными «params» после любых элементов без установленных «params». Вы можете использовать local.xml в своей теме, чтобы обеспечить порядок этих элементов (я рекомендую сначала Magento добавить свои стандартные файлы):

<action method="addJs">
    <script>prototype/javascript0.js</script>
    <params><![CDATA[data-group="js002"]]></params>
    <!-- creates first group js002 -->
</action>
<action method="addJs">
    <script>prototype/javascript1.js</script>
    <params><![CDATA[data-group="js002"]]></params>
    <!-- appends to created group js002, after javascript0 -->
</action>
<action method="addJs">
    <script>prototype/javascript2.js</script>
    <params><![CDATA[data-group="js001"]]></params>
    <!-- creates first group js001 -->
</action>
<action method="addJs">
    <script>prototype/javascript3.js</script>
    <params><![CDATA[data-group="js001"]]></params>
    <!-- appends to created group js001, after javascript2 -->
</action>
<action method="addJs">
    <script>prototype/javascript4.js</script>
    <params><![CDATA[data-group="js002"]]></params>
    <!-- appends to created group js002, after javascript1 -->
</action>
<action method="addJs">
    <script>prototype/javascript5.js</script>
    <!-- no params supplied, will be rendered before any groups -->
</action>

Порядок отображения элементов с набором «params» определяется только порядком выполнения действий. Элементы отображаются сгруппированными по значению «params», поэтому, как только группа «js001» определяется первым действием (javascript2.js), к этой группе добавляются последовательные действия с одинаковым именем группы и т. Д.

В приведенном выше примере порядок рендеринга будет:

  • prototype / javascript5.js (без параметров, идет первым)
  • prototype / javascript0.js (впервые созданная группа параметров "js002")
  • prototype / javascript1.js (первая созданная группа параметров "js002")
  • prototype / javascript4.js (первая созданная группа параметров "js002")
  • prototype / javascript2.js (вторая созданная группа параметров "js001")
  • prototype / javascript3.js (вторая созданная группа параметров "js001")

Элементы, добавленные с использованием addItem, addJs, addCss и т. Д., Обрабатываются одинаково, однако они различаются (и будут соответствующим образом сгруппированы) по типу (см. Порядок ниже), причем каждая группа в супергруппе внутренне упорядочена как объяснено выше:

  • 1025 * JS *
  • skin_js
  • js_css
  • skin_css
1 голос
/ 31 октября 2014

Я понимаю, что этот пост довольно старый, но я наткнулся на него во время исследования этой проблемы, поэтому я решил, почему бы и нет.

Не уверен, что это самое элегантное решение, но оно работает достаточно хорошо для нас.

Я в основном создал новый блок в моем local.xml следующим образом: <block type="core/template" name="prehead" template="page/html/prehead/main.phtml" />

Затем просто изменил мои основные макеты (1column.phtml и друзья), чтобы они содержали это: <head> <?php echo $this->getBlockHtml('prehead') ?> <?php echo $this->getChildHtml('head') ?> </head>

В main.phtml я добавляю свой JS, который я хочу загрузить первым

<script type='text/javascript' src='<?php echo $this->getSkinUrl('js/require.js', array('_secure'=>true)); ?>'></script> <script type='text/javascript' src='<?php echo $this->getSkinUrl('js/main.js', array('_secure'=>true)); ?>'></script>

Это также удобно для нас, поскольку позволяет нам изменять файл main.js в зависимости от того, на какой странице мы работаем, выполняя что-то подобное в local.xml:

<checkout_onestep_index translate="label"> <label>One Step Checkout</label> <block type="core/template" name="prehead" template="page/html/prehead/checkout.phtml" /> </checkout_onestep_index>

Надеюсь, это поможет кому-то, кто случайно наткнется на это.

1026 * Кен *

1 голос
/ 06 сентября 2011

Mage_Page_Block_Html_Head $ _data; содержит массив этих элементов, так что я думаю, вы можете отфильтровать его для вашего же блага. Методы по умолчанию не позволяют определять порядок добавляемых элементов.

0 голосов
/ 01 апреля 2015

конфликт jquery с Prototype в magento:

Самое простое решение - добавить в конец вашего основного файла jquery.

jQuery.noConflict();

Или создать свой собственный файл js и добавить эту строку итакже включите этот файл после основной JS.

0 голосов
/ 06 февраля 2015

Я думаю, что решение Барни Шерголд является наиболее правильным, но комментарий о том, как избегать смены основных файлов, верен.Чтобы получить лучшее из обоих миров, вы можете реализовать решение Барни в модуле, который расширяет класс Mage_Page_Block_Html_Head, например:

Yourcompany / Layouthelper / etc / config.xml

<?xml version="1.0"?>
<config>
    <modules>
        <Yourcompany_Layouthelper>
            <version>0.0.1</version>
        </Yourcompany_Layouthelper>
    </modules>
    <global>
        <blocks>
            <page>
                <rewrite>
                    <html_head>Yourcompany_Layouthelper_Block_Html_Head</html_head>
                </rewrite>
            </page>
        </blocks>
    </global>
</config>

Yourcompany /Layouthelper / Block / Html / Head.php

class Yourcompany_Layouthelper_Block_Html_Head extends Mage_Page_Block_Html_Head {

    public function replaceItem($type, $name, $replace) {
        $newArray = array();

        foreach($this->_data['items'] as $key => $value) {
            if($key == $type.'/'.$name) {
                $newArray[$type . '/'. $replace] = array(
                'type'   => $type,
                'name'   => $replace,
                'params' => $value['params'],
                'if'     => $value['if'],
                'cond'   => $value['cond']);
            } else {
                $newArray[$key] = $value;
            }
        }
        $this->_data['items'] = $newArray;
        return $this;
    }
}
0 голосов
/ 22 сентября 2011

Хорошо, вот мое решение. Сначала скопируйте app \ code \ core \ Mage \ Page \ Block \ Html \ head.php в app \ code \ local \ Mage \ Page \ Block \ Html \ head.php

Затем добавьте эту функцию в файл:

public function replaceItem($type, $name, $replace)
{
    $newArray = array();

    foreach($this->_data['items'] as $key => $value) {
        if($key == $type.'/'.$name) {
            $newArray[$type . '/'. $replace] = array(
            'type'   => $type,
            'name'   => $replace,
            'params' => $value['params'],
            'if'     => $value['if'],
            'cond'   => $value['cond']);
        } else {
            $newArray[$key] = $value;
        }
    }
    $this->_data['items'] = $newArray;
    return $this;
}

Теперь в вашем файле макета .XML есть строка, подобная этой:

<action method="replaceItem"><type>js</type><name>prototype/prototype.js</name><replace>onestepcheckout/prototype/prototype.js</replace></action>

Параметры такие же, как и для removeItem, НО теперь заменяющий файл будет добавлен в список в том же месте, что и исходный файл. Он также унаследует один и тот же параметр, значения if и cond. Пожалуйста, используйте этот код осторожно, так как я только что написал и провел базовые тесты!

0 голосов
/ 06 сентября 2011

Поскольку local.xml наконец загружен системой magento, то упомянутый там xml, наконец, объединен. Это может быть причиной того, что ваш новый прототип загружен ниже других скриптов.

Кроме того, вы можете переопределить метод Mage_Page_Block_Html_Head :: getCssJsHtml () и поиграть с ним.

Спасибо

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...