本文介绍了如何更改Dojo TabContainer行为,只需打开外部链接,而不是显示ContentPane?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用具有几个不同的 ContentPane 孩子的 TabContainer 。每个人都配备了一个 href param以获取当选择选项卡时显示的外部AJAX内容:

I am working with a TabContainer having several different ContentPane children. Each of them is equipped with a href param to fetch external AJAX content shown when a tab is being selected:

dojo.addOnLoad(function() {
    var tc_nav = new dijit.layout.TabContainer({
        style: 'width: 98%;',
        doLayout: false
    }, 'tc_nav');

    var cp1 = new dijit.layout.ContentPane({
        title: 'Test 1',
        href: 'ajax?test1',
        style: 'padding: 10px;',
        selected: true
    });

    dojo.connect(cp1, 'onShow', function() {
        cp1.refresh();
    });

    /*
     * ...
     */

    tc_nav.addChild(cp1);

    /*
     * ...
     */

    tc_nav.startup();
});

现在我想集成其他应用程序之间的选项卡,而不是加载内容成为 ContentPane 该标签应该遵循同一窗口中的简单链接(例如< a href =http://www.google .com /> Link< / a> ),留下包含js / dojo应用的页面。我没有找到满意的解决方案,也没有找到符合这个要求的dojo小部件。什么是最好的方法?

Now I want to integrate a tab among the others which should be different in its behaviour: Instead of loading content into a ContentPane the tab should follow a simple link in the same window (like a <a href="http://www.google.com/">Link</a>), leaving the page containing the js/dojo app. I didn't find any satisfying solution yet, nor a dojo widget matching this requirement. What would be the best approach?

作为一个不愉快的解决方法,我创建了一个覆盖 onShow 事件触发一个 window.location.href ='...';

As an unpleasant workaround I created an overridden onShow event firing a window.location.href = '...';:

var cp2 = new dijit.layout.ContentPane({
    title: 'Test 2',
    style: 'padding: 10px;'
});

dojo.connect(cp2, 'onShow', function() {
    window.location.href = 'http://www.google.com/';
});

此解决方法的一个令人讨厌的缺点是事实是 ContentPane 首先被加载,然后设置 window.location.href ,这导致一个非常特别的懒惰重载效应,从而导致糟糕的用户体验。我想避免这个中间步骤。

An annoying disadvantage of this workaround is the fact the ContentPane is loaded first and afterwards the window.location.href is set, which leads to a quite peculiar lazy reload effect and consequently to a bad user experience. I would like to avoid this intermediate step.

推荐答案

满足上述要求的可能的解决方法是覆盖 onClick 事件的 ContentPane controlButton

A possible workaround to meet the above mentioned requirements is to override the onClick event of the ContentPane's controlButton:

/*
 * ...
 */

var cp2 = new dijit.layout.ContentPane({
    title: 'Test 2',
    style: 'padding: 10px;'
});

/*
 * ...
 */

tc_nav.addChild(cp2);

/*
 * ...
 */

tc_nav.startup();

/*
 * ...
 */

cp2.controlButton.onClick = function() {
    window.location.href = 'http://www.google.com/';
};

请注意,不要在 onClick 事件(例如通过 dojo.connect(cp2.controlButton,'onClick',function(){/ * ... * /}); ),而是覆盖它,否则将首先调用 ContentPane 的内容。

Please note not to attach another function to the onClick event (e. g. by dojo.connect(cp2.controlButton, 'onClick', function() { /* ... */ });), but rather to override it, otherwise the ContentPane's content would be called up first.

请注意, TabContainer startup()函数必须首先调用以使 controlButton 对象可访问。

Please note further the TabContainer's startup() function has to be invoked first to make the controlButton object accessible.

这篇关于如何更改Dojo TabContainer行为,只需打开外部链接,而不是显示ContentPane?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-11 23:39