3

他の特定のJavaScriptファイルの後にJavaScriptファイルを含める必要があります。通常、次のような構文を使用してXMLファイルに含めます。

<action method="addJs"><script>myfile.js</script></action>

また

<action method="addItem"><type>js</type><name>myfile.js</name></action>

正しい順序であるため、ファイルは希望どおりに含まれています。

重要なのは、ファイルを何回インクルードする必要があるのか​​わからないということです。具体的には、jquery * .jsファイルのすべてのインスタンスの後にjQuery.noConflict（）を使用してファイルをインクルードしようとしています。私が取り組んでいるWebサイトはまだ開発中であり、独自のjqueryライブラリを含むいくつかの新しい拡張機能が追加される可能性があります（プロジェクトに取り組んでいるのは私だけではないため、気付かないかもしれません）。

フロントエンドでレイアウトをレンダリングするときにjsファイルを含めることに関するイベントはありますか、または目的の効果を達成するために書き直すことができる方法がありますか？

4

4 に答える 4

2

スクリプトYを含めるたびに、スクリプトXを含めるように追加する唯一の方法は、追加を行う関数を変更することです。

app / code / core / Mage / Page / Block / Html / Head.phpを開き、関数getCssJsHtmlを変更します。このような：

public function getCssJsHtml()
{
    // separate items by types
    $lines  = array();
    foreach ($this->_data['items'] as $item) {
        if (!is_null($item['cond']) && !$this->getData($item['cond']) || !isset($item['name'])) {
            continue;
        }
        $if     = !empty($item['if']) ? $item['if'] : '';
        $params = !empty($item['params']) ? $item['params'] : '';
        switch ($item['type']) {
            case 'js':        // js/*.js
            case 'skin_js':   // skin/*/*.js
            case 'js_css':    // js/*.css
            case 'skin_css':  // skin/*/*.css
                $lines[$if][$item['type']][$params][$item['name']] = $item['name'];
                if(stripos($item['name'], 'jquery') !== false)$lines[$if][$item['type']][$params]['2_'.$item['name']] = $yourfilename;
                break;
            default:
                $this->_separateOtherHtmlHeadElements($lines, $if, $item['type'], $params, $item['name'], $item);
                break;
        }
    }
...

追加するファイルがjquery（）であるかどうかを確認するためのチェックを追加したことがわかります。stripos($item['name'], 'jquery') !== falseそうである場合は、その直後にパスを使用して新しいアイテムを追加します$yourfilename。

Magentoにはすでにスキンファイルを並べ替える機能があるはずでしたが、a）並べ替え属性を提供するすべての人に依存しており、b）そもそも実際に正しく機能することはありませんでした。

于 2013-06-05T11:45:29.813 に答える
2

やあ、

Magentoはデフォルトではそれを許可していません。特定の順序（ヘッダーのcssまたはjavascript）でファイルを追加できるようにするには、コアをカスタマイズする必要があります。

カスタムモジュールを作成し、page/html_headブロックを書き換えます。

<?xml version="1.0"?>
<config>
    <modules>
        <Koncz_Utility>
            <version>1.0.0</version>
        </Koncz_Utility>
    </modules>
    <global>
        <blocks>
            <class>Koncz_Utility_Block</class>
            <page>
                <rewrite>
                    <html_head>Koncz_Utility_Block_Page_Html_Head</html_head>
                </rewrite>
            </page>          
        </blocks>
    </global>
</config>

そして、2つのカスタム関数を追加します：addItemFirstとaddItemAfter

class Koncz_Utility_Block_Page_Html_Head extends Mage_Page_Block_Html_Head {
/*
 * Adds a head element into the first position, usage same as for addItem ;)
 */

public function addItemFirst($type, $name, $params = null, $if = null, $cond = null) {
    if ($type === 'skin_css' && empty($params)) {
        $params = 'media="all"';
    }

    $firstElement = array();
    $firstElement[$type . '/' . $name] = array(
        'type' => $type,
        'name' => $name,
        'params' => $params,
        'if' => $if,
        'cond' => $cond,
    );

    $this->_data['items'] = array_merge($firstElement, $this->_data['items']);

    return $this;
}

/*
* Adds a custom css, or js file after the $type, if it was found! $type=js/jquery/jquery.js  <= or skin_js/path 
*/
public function addItemAfter($after, $type, $name, $params = null, $if = null, $cond = null) {
    if ($type === 'skin_css' && empty($params)) {
        $params = 'media="all"';
    }

    $firstElement = array();
    $firstElement[$type . '/' . $name] = array(
        'type' => $type,
        'name' => $name,
        'params' => $params,
        'if' => $if,
        'cond' => $cond,
    );

    if (array_key_exists($after, $this->_data['items'])) :
        // get the position 
        $pos = 1;
        foreach ($this->_data['items'] as $key => $options) :
            if ($key == $after) :
                break;
            endif;
            $pos +=1;
        endforeach;

        array_splice($this->_data['items'], $pos, 0, $firstElement);

    endif;


    return $this;
}

}

この後、local.xmlで次を使用できます:(これにより、最初の位置にjquery.jsが追加され、2番目の位置にjqueryの後にjquery.no-conflict.jsが追加されます）。{{また、skin_jsファイルはjsタイプの後に追加されることにも言及する価値があります！したがって、ベースjsファイルにはskin_jsではなくjsを使用してください。

<?xml version="1.0"?>
<layout version="0.1.0">
    <default>        
        <update handle="add_jquery_elegant_way" />
    </default>
    <add_jquery_elegant_way>
        <reference name="head">
            <action method="addItemFirst"><type>js</type><script>jquery/jquery.js</script></action>
            <action method="addItemAfter">
                <after>js/jquery/jquery.js</after>
                <type>js</type>
                <script>jquery/jquery.no-conflict.js</script>
            </action>
        </reference>
    </add_jquery_elegant_way>
</layout>
于 2014-02-23T11:00:38.120 に答える
1

最も簡単な方法は、jquery * .jsを編集し、ファイルの最後にこれを追加することです。

$jq=jQuery.noConflict();

次に、$ jqを使用してjQueryオブジェクトにアクセスすると、jquery.jsが含まれると、自動的にnoConflictモードに設定されます。

于 2012-09-21T08:26:37.493 に答える
-1

取扱説明書はheader.phtmlに手動で置くことができます。app / design / frontend / yoursite / path / template / page / html/header.phtml。そして、そこに置いたものは、jsインクルード後にhtmlに移動します。

于 2012-09-10T15:00:27.633 に答える