不久前我制作了一个 JavaScript 计算器，现在我在另一个项目中重复使用它。问题是，它甚至不再显示在页面上。这是 calc.html 文件的代码。
{% extends 'base.html' %}
{% block body %}
<div class="text-center">
<h1>Calculator</h1>
</div>
<div id="JSCalc">
<form name="calculator">
<input type="text" name="answer"/>
<br />
<input type="button" value=" 7" onclick="calculator.answer.value += '7'"/>
<input type="button" value=" 8" onclick="calculator.answer.value += '8'"/>
<input type="button" value=" 9" onclick="calculator.answer.value += '9'"/>
<input type="button" value=" *" onclick="calculator.answer.value += '*'"/>
<br />
<input type="button" value=" 4" onclick="calculator.answer.value += '4'"/>
<input type="button" value=" 5" onclick="calculator.answer.value += '5'"/>
<input type="button" value=" 6" onclick="calculator.answer.value += '6'"/>
<input type="button" value=" -" onclick="calculator.answer.value += '-'"/>
<br />
<input type="button" value=" 1" onclick="calculator.answer.value += '1'"/>
<input type="button" value=" 2" onclick="calculator.answer.value += '2'"/>
<input type="button" value=" 3" onclick="calculator.answer.value += '3'"/>
<input type="button" value=" +" onclick="calculator.answer.value += '+'"/>
<br />
<input type="button" value=" 0" onclick="calculator.answer.value += '0'"/>
<input type="button" value=" C" onclick="calculator.answer.value = ''"/>
<input type="button" value=" =" onclick="calculator.answer.value = eval(calculator.answer.value)"/>
<input type="button" value=" /" onclick="calculator.answer.value += '/'"/>
<br />
</form>
</div>
{% endblock %}
这是它扩展的base.html 文件。请注意，这不是我写的，我只是想让计算器使用它，但我没有看到是什么阻止了它。
<!DOCTYPE html>
{% load static %}
<html class="no-js" lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>
{% if indexPage %}
Sales Tracker
{% else %}
{% block title %}{% endblock %} ⋅ Sales Tracker
{% endif %}
</title>
<link rel='stylesheet' href='{% static "css/foundation.min.css" %}'/>
<link rel='stylesheet' href='{% static "css/app.css" %}'/>
</head>
<body>
<!-- Top Nav Bar -->
<div class="top-bar">
<div class="top-bar-left">
<input type="submit" class="blue" value="Calculator" onclick="window.open('http://localhost:8000/calc','_blank','height=425,width=425')" />
<a href="/">Sales Tracker</a>
</div>
<div class="top-bar-right">
{% if user.is_authenticated %}
<a href="/account/">Account</a>
<a href="/logout/">Logout</a>
{% else %}
<a href="/register/">Register</a>
<a href="/login/">Login</a>
{% endif %}
</div>
</div>
<!-- [END] Top Nav Bar -->
{% block default_content %}{% endblock %}
{% block content %}{% endblock %}
<script src='{% static "js/vendor/jquery.js" %}'></script>
<script src='{% static "js/vendor/what-input.js" %}'></script>
<script src='{% static "js/vendor/foundation.min.js" %}'></script>
<script src='{% static "js/app.js" %}'></script>
{% block scripts %}{% endblock %}
</body>
</html>
最佳答案
您说您需要访问:
http://localhost:8000/calc.html (calc.html)
那么你还没有定义它吗？您正在尝试访问:
http://localhost:8000/calc (calc)
您的代码:
<input type="submit" class="blue" value="Calculator" onclick="window.open('http://localhost:8000/calc','_blank','height=425,width=425')" />
试试这个:
<input type="submit" class="blue" value="Calculator" onclick="window.open('http://localhost:8000/calc.html','_blank','height=425,width=425')" />
关于javascript - 为什么我的 JavaScript 计算器不能使用 base.html？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46900801/