โหลด js ในส่วนท้ายใน Magento

<reference name="footer">
    <action method="addItem">
        <type>skin_js</type>
        <file>js/fabric/tool/controller_tool.js</file>
    </action>
</reference>

ฉันใช้โค้ดด้านบนเพื่อโหลด js ในส่วนท้าย แต่วีโอไอพีพ่นข้อผิดพลาดเช่น

วิธีการที่ไม่ถูกต้อง Mage_Page_Block_Html_Footer :: addItem (Array ([0] => skin_js [1] => js / fabric / tool / controller_tool.js))

ฉันต้องการโหลด js ในส่วนท้าย วิธีที่จะเอาชนะปัญหานี้

ปัจจุบันส่วนท้ายของบล็อกวีโอไอพียังไม่ได้รับการออกแบบมาเพื่อเพิ่มจาวาสคริปต์

ฉันได้ลองใช้การรีแฟคเตอร์ Magento และบล็อกท้ายกระดาษเพื่อโหลด JS ทุกครั้งในส่วนท้ายแทนที่จะเป็นส่วนหัว แต่วิธีการเรียก JS ภายในเทมเพลตทำให้ยากมากที่จะทำงานนี้

ข้อเสนอแนะของฉันเพื่อแก้ไขปัญหาของคุณคือการปรับปรุงเค้าโครงของคุณเช่นนี้:

<reference name="before_body_end">
    <block type="core/template" name="controller_tool_javascript" template="fabric/tool/controller_tool_js.phtml"/>
</reference>

สร้างfabric/tool/controller_tool_js.phtmlไฟล์ในโฟลเดอร์แม่แบบของคุณด้วยรหัสต่อไปนี้:

<script type="text/javascript" src="<?php echo $this->getSkinUrl('js/fabric/tool/controller_tool.js') ?>"></script>

แจ้งให้เราทราบหากใช้งานได้

ส่วนท้ายไม่มีฟังก์ชันเหล่านี้เพียงheadทำตามที่บล็อกนี้เป็นประเภทpage/html_headที่เก็บวิธีการเหล่านี้

คุณสามารถทำได้โดยใส่<script src=...></script>แท็กJS ภายในเทมเพลต ( .phtmlไฟล์) และรวมไว้เป็นcore/templateบล็อก:

<reference name="footer">
    <block type="core/template" name="fabric_controller_tool_js" template="fabric/controller_tool_js.phtml" />
</reference>

นอกจากนี้คุณสามารถเพิ่มผ่านcore/textบล็อก:

<reference name="footer">
    <block type="core/text" name="fabric_controller_tool_js">
         <action method="setText">
             <text><![CDATA[<script src="/js/fabric/tool/controller_tool.js"></script>]]></text>
         </action>
    </block>
</reference>

แค่อยากบอกคุณว่าทำไมaddItemไม่ทำงานreference name="footer"

เมื่อคุณใช้reference name="footer"แล้วมันจะเรียกบล็อกนี้

<block type="page/html_footer" name="footer" as="footer" template="page/html/footer.phtml"> 

ซึ่งคุณจะพบในpage.xmlชุดรูปแบบของคุณ

ดังนั้นมันจึงหมายความว่ามันจะตรวจสอบaddItemวิธีการ / ฟังก์ชั่นในคลาสบล็อกนั้นหรือในคลาสแม่ แต่ฟังก์ชันนี้ไม่ได้อยู่ที่นั่นนั่นเป็นเหตุผลที่มันจะไม่ทำงานและมันจะโยนข้อยกเว้น

<reference name="footer">ไม่ทำงานในกรณีของฉัน ฉันพบบล็อกที่เหมาะสมกว่าสำหรับ js ที่เรียกว่าjs:

<reference name="js">
    <block type="core/text" name="fabric_controller_tool_js">
        <action method="setText">
            <text><![CDATA[<script src="/js/fabric/tool/controller_tool.js"></script>]]></text>
        </action>
    </block>
</reference>

หรือผ่านเทมเพลตที่แยกต่างหาก เส้นทาง: design / adminhtml / default / default / template / sales / order / js.phtml:

<reference name="js">
    <block type="core/template" name="fabric_controller_tool_js" template="sales/order/js.phtml" />
</reference>

ฉันใช้วิธีการต่าง ๆ เพื่อบรรลุสิ่งที่คุณอาจกำลังมองหาที่จะทำให้สำเร็จ แทนที่จะบิดแขนของวีโอไอพีฉันแค่โหลดสคริปท์ไว้ที่หัว แต่ตั้งDOMContentLoadedผู้ฟังเหตุการณ์ (ไม่สนับสนุนใน ie8) ที่ทำหน้าที่ของฉัน

app / ออกแบบ / ส่วนหน้า / ฐาน / default / รูปแบบ / namespace_module.xml

<?xml version="1.0" encoding="UTF-8"?>
<layout version="0.0.1">
  <default>
    <reference name="head">
      <action method="addJs">
        <script>NameSpace/Module/entry.js</script>
      </action>
    </reference>
  </default>
</layout>

app / รหัส / ชุมชน / NameSpace / โมดูล / etc / config.xml

<?xml version="1.0" encoding="UTF-8"?>
<config>
  <modules>
    <NameSpace_Module>
      <version>0.0.1</version>
    </NameSpace_Module>
  </modules>
  <frontend>
    <layout>
      <updates>
        <module>
          <file>namespace_module.xml</file>
        </module>
      </updates>
    </layout>
  </frontend>
</config>

js / NameSpace / โมดูล / entry.js

document.addEventListener("DOMContentLoaded", function(event) {
  // do something
});

คุณสามารถเพิ่มบล็อกใหม่ใน page.xml

<block type="core/text_list" name="before_body_end" as="before_body_end" translate="label">
    <block type="page/html_head" name="footerjscss" as="footerjscss" after="-" template="page/html/footerjscss.phtml"/>
</block>

จากนั้นเพิ่มไฟล์ JS & CSS ใน layout.xml ใด ๆ

<reference name="footerjscss">
    <action method="addItem"><type>skin_js</type><name>js/slideshow.js</name></action>
    <action method="addItem"><type>skin_css</type><name>css/madisonisland.css</name><params/><if/></action>
</reference>

สร้างไฟล์. phtml ในหน้า / html / footerjscss.phtml และเพิ่มรายการต่อไปนี้

<?php echo $this->getCssJsHtml() ?>

ตอนนี้เรียกบล็อกในเทมเพลตหน้า“ 3columns.phtml” และอื่น ๆ คุณจะต้องส่งออกบล็อกนี้ก่อนแท็ก:

<?php echo $this->getChildHtml('before_body_end') ?>

รหัสอ้างอิงที่นี่: http://blog.rahuldadhich.com/magento-load-css-js-footer/