如何使用dojo.style处理多个表单页面?

时间:2014-03-11 13:34:49

标签: javascript css dojo hide show

我正在使用dojo 1.6并尝试使用以下代码处理表单页面:

dojo.forEach(dojo.query(".form-page"), function(page, i){
    if(page.id == "form-part1"){
        dojo.style(page, "display", "block");
    }else{
        dojo.style(page, "display", "none");
    }
 });

 dojo.query(".nextPgButton").connect("onclick", function(){
      var pages = dojo.query(".form-page");
      dojo.forEach(pages, function (page, i){
          if(dojo.style(page, "display") != "none"){
               dojo.style(page, "display", "none");
               dojo.style(page[i+1], "display", "block");
           }
      });
 });

第一个语句起作用,因为只有第一页按预期显示。但第二个没有正确检索页面的当前样式。因此,当我点击我的下一页按钮时,所有页面都被隐藏。

dojo.style(page,"display") // always return "block"

有人能告诉我为什么dojo.style无法检索我页面的实际风格吗?

非常感谢

1 个答案:

答案 0 :(得分:1)

你在那里做了一些非常奇怪的事情。

page[i+1]的最后一行实际上永远不会有效,因为page不是数组。我想你可能意味着pages[i+1]

如果你实际上意味着我刚刚说过的话,那么常识会返回block。只考虑你有两个.form-page元素的情况。单击按钮时会发生以下情况:

第一次迭代: 标识为#form-part1的第一个元素为display: block,因为您最初将其设置为{1}}。这显然意味着if()内的forEach()语句正在执行,因为它不等于"none"

这意味着它将#form-part1的样式设置为display: none,但这也意味着它将下一个元素CSS设置为display: block

第二次迭代: 您的第二个.form-page现在有display: block(读取上一次迭代的最后一句)。这意味着if() 已执行,将样式设置回display: none

它也会尝试查找下一页,但是不再有其他页面,所以它也会抛出错误(代码中的另一个错误)。


所以你显然必须重新检查你的代码,因为你做了一些错误的事情。你还需要改写你的问题,因为现在还不清楚你实际想要实现的目标。但对我而言,如果你有2个页面,if()语句总是被执行,这是有意义的。