Question

任何人都知道在后端使用javascript监听magento标签点击的方法，假设您想在每次有人点击编辑客户页面上的标签时执行某些操作。 adminhtml / tabs.js有这个：

    tabMouseClick : function(event) {
    var tab = Event.findElement(event, 'a');

    // go directly to specified url or switch tab
    if ((tab.href.indexOf('#') != tab.href.length-1)
        && !(Element.hasClassName(tab, 'ajax'))
    ) {
        location.href = tab.href;
    }
    else {
        this.showTabContent(tab);
    }
    Event.stop(event);
},

但没有用，任何人都有任何想法？我也尝试过使用标准原型js观察者：

Event.observe("product_info_tabs", "click", function () 
{ alert(1); 
});

也没做任何事情。该解决方案不应该修改核心，因为这会增加许多升级问题，也可能是未来的magento版本。

Answer 1

要收听后端中Magento标签（varienTabs）的点击次数，您只需将自定义观察者添加到现有标签即可。使用您的示例（后端的“编辑客户页面”），这将是：

var myTabs = $$("#customer_info_tabs li a.tab-item-link");
for (var i = 0; i < myTabs.length; i++) {
    Event.observe(myTabs[i], "click", function (event) {
        var tab = Event.findElement(event, "a");
        // insert your custom code here
        alert(tab.id);
        Event.stop(event);
    });
}

要在不更改核心文件的情况下实现自定义观察者（打破升级性），您可以覆盖相应的管理控制器操作。

例如，覆盖Mage_Adminhtml_CustomerController::editAction()：

<!-- app/code/local/My/Adminhtml/etc/config.xml -->
<config>
    <modules>
        <My_Adminhtml>
            <version>0.1.0</version>
        </My_Adminhtml>
    </modules>
    <admin>
        <routers>
            <adminhtml>
                <args>
                    <modules>
                        <My_Adminhtml before="Mage_Adminhtml">My_Adminhtml</My_Adminhtml>
                    </modules>
                </args>
            </adminhtml>
        </routers>
    </admin>
</config>

接下来，定义您的自定义管理员控制器：

// app/code/local/My/Adminhtml/controllers/CustomerController.php
require 'Mage/Adminhtml/controllers/CustomerController.php';
class My_Adminhtml_CustomerController extends Mage_Adminhtml_CustomerController
{
    public editAction()
    {
        // copy of Mage_Adminhtml_CustomerController::editAction() code here
    } 
}

最后，在重写的操作中，创建一个包含自定义观察者脚本的附加文本块，并将该块附加到布局。例如，在editAction末尾插入如下内容：

    :
    $this->loadLayout();
    $oBlock = $this->getLayout()->createBlock('core/text')->setText('
         <script type="text/javascript">
            var myTabs = $$("#customer_info_tabs li a.tab-item-link");
            for (var i = 0; i < myTabs.length; i++) {
                Event.observe(myTabs[i], "click", function (event) {
                    var tab = Event.findElement(event, "a");
                    alert(tab.id);
                    Event.stop(event);
                });
            }
         </script>
    ');
    $this->getLayout()->getBlock('left')->append($oBlock);
    $this->renderLayout();
    :

Answer 2

老答案，但因为我在这里：当显示标签时，Magento内部发生事件。你可以简单地加入那个事件。

varienGlobalEvents.attachEventHandler('showTab', function(arg){
            console.log(arg.tab);
        });

也不需要通过覆盖控制器注入。只需添加yoru自己的自定义布局指令，并相应地加载js。

Magento：Tab click事件

2 个答案: