Django的Javascript和调试

我想在我的模板中添加使用jQuery的JS datepicker，但我不能为我的生活得到它的工作。Django的Javascript和调试

我header.html中（主模板）：

[...] 
    <script src="{% static 'js/jquery.js' %}"></script> 
    <script src="{% static 'js/jquery-ui.js' %}"></script> 
    <script> 
     $(function() { 
      $("#datepicker").datepicker({ 
       showOn: "button", 
       buttonImage: "{% static 'images/calendar.gif' %}", 
       buttonImageOnly: true, 
       buttonText: "Select date" 
      }); 
     }); 
    </script> 
    <title>{% block title %}{% endblock %}</title> 
</head>

包含脚本模板：

[...] 
    <div class="form-group"> 
     <div class="col-sm-offset-2 col-sm-10"> 
      <span class="text-danger small">{{ field.errors }}</span> 
     </div> 
     <label class="control-label col-sm-2"> 
      {{ field.label_tag }} 
     </label> 
     <div class="col-sm-10"> 
      <input type="text" id="datepicker"> 
     </div> 
    </div> 
[...]

如果我做一个完全裸露片，并使用脚本，它的工作原理找到。如果我把所有的代码放在主要的header.html模板上，它不起作用。如果我完全擦掉header.html并将所有代码替换为脚本源代码，它就可以工作。我看不到我的代码如何阻止脚本工作。我在这里错过了什么？另外，当开发服务器是远程时，什么是排除故障的好方法？

来源

2016-10-23 Flibertyjibbet

调试好办法是打开Chrome浏览器开发工具，寻找在控制台中的错误。 – serg

是的，这是相当标准的。我已经这样做了，但是在这种情况下，它并没有给我提供任何有关这个问题的富有成效的答案：（ – Flibertyjibbet

需要开始处理它。然后查看页面源代码以确保你的代码全部存在，添加'console.log $（“#datepicker”））'看看它是否可以找到这个div – serg

调试HTML：

公开赛在火狐的页面（不是其他浏览器），并查看源代码（在Linux或Windows在Mac上，命令-U CTRL-U）。查看源代码时，Firefox将突出显示HTML中的错误。

要查看错误，您必须使用Firefox并通过“查看源代码”选项查看源代码 - 不要使用浏览器控制台/检查器，因为检查器显示的是实时DOM，而不是HTML源代码。

如果您安装了HTML tidy，那么您可以保存页面的源代码并运行tidy my-file.html来扫描它的语法错误。它会显示这样的错误：

来源

2016-10-24 05:46:14 Josh

这是显示相同的我在Chrome浏览器上看到的东西，没有错误突出显示。通过点击标签中的所有链接，我确实找到了jquery.js的链接，但修复它并没有解决我的问题。我比较了工作原始页面和破损页面上的来源，并没有看到任何区别。 – Flibertyjibbet

开始怀疑我是否应该强制使用HTML5并使用似乎它会使用日期选择器自动填充。感觉像是一个坏主意，但嘿..我们在技术行业：P – Flibertyjibbet

是的，这是一个坏主意。似乎这是一个Chrome的东西。 Firefox没有内置日期选择器，或者它只是无法识别HTML5元素类型。 – Flibertyjibbet

Django的Javascript和调试

回答

相关问题