Question

有关最新状态，请参阅更新3。我收到错误＆＃34;尝试注册id == contact-form的小部件，但该ID已经注册＆＃34;从我的dojo脚本。这个问题在此之前出现过。我相信我的情况可能会有所不同。当我从我的网站上的一个页面转到另一个页面时，我收到错误。所有页面都具有相同的脚本。如果我重新加载页面，我就不会收到错误。如果我去另一个网站然后回来，我就不会收到错误。我的网站过去常常使用Symfony框架。我刚把它转换为Ruby on Rails。我很确定我没有与Symfony有这个问题，但我并不积极。我今天早上刚刚将我的名字服务器更改为新版本，因此我无法验证。该网站是amcolan.info。如果您点击链接，它应该在第一页上正常工作。胡佛在图像上进行测试。它应该放大。

这是实例化小部件的脚本：

require(["dojo/dom",
        "dojo/request",
        "dojo/dom-form",
        "dijit/Dialog",
        "dijit/form/Form",
        "dijit/form/TextBox",
        "dijit/form/ValidationTextBox",
        "dijit/form/Textarea",
        "dijit/form/Button",
        "dojox/validate/web",
        "dojo/domReady!"],
      function(dom, request, domForm, Dialog, Form, TextBox, ValidationTextBox, TextArea, Button ){

        alertDialog = new Dialog({
          title: "Email Result",
          content: "<p>No Content</p>",
          sytle: "width: 50em"
        });

        emailDialog = new Dialog({
          title: "Email Form",
          content: dom.byId("emailFormHTML").textContent,
          style: "width: 50em"
        });

        emForm = new Form({
        },"contact-form");

        toText = new TextBox({
          name: "addressee",
          readOnly: "readOnly",
          value: "Staff"
        },"to");

        nameText = new ValidationTextBox({
          name: "name",
          placeholder: "Your Name",
          required: "true",
          missingMessage: "We'd like to know who you are."
        },"name");

        emailText = new ValidationTextBox({
          name: "email",
          placeholder: "Your email",
          validator: dojox.validate.isEmailAddress,
          invalidMessage: "This is not a valid email address!"
        },"email");

        messageText = new TextArea({
          name: "message",
          placeholder: "Your message"
        },"message");

        sendBtn = new Button({
          label: "Send",
          onClick: function(){
            if (emForm.validate() == true){
              // Post the data to the server
              request.post("<%= contact_create_path %>",
                      {data: domForm.toObject("contact-form"),
                        // Wait 2 seconds for a response
                        timeout: 4000

                      }).then(function(response){
                        emailDialog.hide();
                        alertDialog.set("content", response)
                        alertDialog.show();
                      });
            }
          }
        },"submit-btn");
      });
</script>

如果我注释掉联系表单小部件，则会在下一个小部件中出错。这可能与Rails如何处理页面有关吗？

更新

我可以通过测试窗口小部件来处理症状，然后再创建它：

        emform = registry.byId("contact-form");
        if (!emform){
          emForm = new Form({
          },"contact-form");}

一旦我为所有小部件执行此操作，该错误就消失了。修复可能会导致其他人。我还是想知道为什么会遇到这个问题。我是否错过了一些关于小部件保留的基本Javascript或dojo概念？

更新2

我以为我得到了它，但没有。我不再有任何错误。我仍然遇到从网站上的另一个页面导航时没有执行Javascript的问题。同样，如果我重新加载页面或从其他网站进入，它工作正常。这是启用页面底部的联系链接的Javascript：

require(["dojo/on",
    "dojo/dom",
    "dojo/mouse",
    "dojo/dom-style",
    "dojo/domReady!"],
function(on, dom, mouse, style)
{
    var emailLink = dom.byId("emailClickable");

    on(emailLink, "click", function(evt){
        toText.set("value","Site Administrator");
        emailDialog.show();
    });
    on(emailLink, mouse.enter, function(evt){
        style.set(emailLink, "cursor", "pointer")
    });
});

更新3

我把console.info语句放在所有的javascript函数中。当我在网站中从一个页面转到另一个页面时，我看不到任何消息。我还在Firebug Net选项卡中注意到，只有在从缓存加载页面时才会出现问题。

Answer 1

您的小部件需要其他小部件才能完全启动和初始化（联系表单）。在这种情况下，您应该启动窗口小部件，直到所有其他的dojo窗口小部件完成加载并初始化页面上的所有窗口小部件。

所以用"dojo/domReady!"替换"dojo/ready"并将其全部包含在ready函数中。有关详细信息，请查看dojo guide on dojo/ready here。

Answer 2

不，不是外国政府试图破坏我的代码的稳定性，这是涡旋式的，或者至少是我对它的使用。在我的标题中，我有：

<%#= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application' %>

我通过注释turbolinks include并添加一个包含它的包来解决了这个问题。我还在应用程序文件中注释了turbolinks require语句。这里有关于Turbolinks如何运作的描述their site：

Turbolinks可以更快地在您的Web应用程序中建立以下链接。它不是让浏览器在每个页面更改之间重新编译JavaScript和CSS，而是使当前页面实例保持活动状态，并仅替换头部中的正文和标题。想想CGI与持久性过程。

我的猜测是，通过保持页面实例保持活动，turbolinks无法保存。这可能与我使用dojo的事实有关。他们对jQuery的修复/解决方法的描述似乎证实了这一点：

如果你有很多现有的JavaScript绑定jQuery.ready（）上的元素，你可以将jquery.turbolinks库拉到你的项目中，当Turbolinks触发页面时会触发ready（）：load event。它可能会恢复某些库的功能。

将gem添加到项目中，然后在jquery.js之后但在turbolinks.js之前将以下行添加到JavaScript清单文件中：

从缓存加载网页时Javascript不执行

更新

更新2

更新3

2 个答案: