主题在dojo的网站上不起作用?

时间:2014-12-05 07:02:07

标签: javascript css dojo

http://demos.dojotoolkit.org/demos/themePreviewer/demo.html 在这个主题预览器中,无论我如何改变主题,都没有任何反应。 此外,在参考指南的任何样本中,当我尝试运行它们时,它们看起来根本没有样式,就像css不存在一样。 我尝试过其他浏览器,都是一样的。 虽然它在我的项目中运作良好,但我想知道出了什么问题。

2 个答案:

答案 0 :(得分:0)

我无法想象它会起作用。我查看了源代码,看起来甚至没有尝试更改主体上的CSS位置或类名(两者都需要更改主题)。

似乎唯一发生的事情是?theme=查询参数仅用于定义哪些主题应显示为链接。但即使这样也会出错。他们定义了这样的主题:

var availableThemes = [
  { theme: "claro", author: "Dojo", baseUri: "../themes/" },
  { theme: "tundra", author: "Dojo", baseUri: "../themes/" },
  { theme: "soria", author: "nikolai", baseUri: "../themes/" },
  { theme: "nihilo", author: "nikolai", baseUri: "../themes/" }
];

然后他们加载当前主题:

var curTheme = location.search.replace(/.*theme=([a-z]+).*/, "$1") || "claro";

然后他们尝试加载正确的菜单选项:

var tmpString = '';
array.forEach(availableThemes, function(theme){
  if(theme != curTheme){
    tmpString +=
      '<a href="?theme=' + theme.theme + '">' + theme.theme + '</' + 'a> (' +
      '<a href="?theme=' + theme.theme + '&dir=rtl">RTL</' + 'a> ' +
      '<a href="?theme=' + theme.theme + '&a11y=true">high-contrast</' + 'a> ' +
      '<a href="?theme=' + theme.theme + '&dir=rtl&a11y=true">RTL+high-contrast</' + 'a> )' +
      ' - by: ' + theme.author + ' <br>';
  }
});

但正如您所看到的那样,他们将对象与字符串(theme != curTheme)进行比较,而这些字符串永远不会有效。因此,代码似乎非常错误,所以我认为你不能依赖它。我建议打开一张票来报告这个问题。


如果您对其他主题中的内容感兴趣,可以打开DevTools并更改CSS文件(应替换../../dijit/themes/claro/claro.css),然后更改{{1}上的类名} tag。

或者您可以在浏览器的控制台中执行以下代码:

<body>

答案 1 :(得分:0)

请查看Dijit theme tester,它位于主题文件夹下的Dijit包中。

你可能认为它看起来几乎相同。它有点像 - 演示文件夹下的themePreviewer在某些时候被复制了一半,但遗憾的是从未完全奏效,AFAIK。