{% extends "base.html" %}
{% load i18n %}
{% load staticfiles %}
{% block jsscript %}
<!-- Script code -->
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function() {
$('#btnNext_picklocation').attr('disabled','disabled');
$("#location input[type='checkbox']").click(function(){
if($('#location input[type="checkbox"]').is(':checked'))
{
$('#btnNext_picklocation').removeAttr('disabled');
}
else
{
$('#btnNext_picklocation').attr('disabled','disabled');
}
});
$("#location .maps img").attr("src","{% static 'media/loading.gif' %}");
$("#location .maps img").error(function(){
$(this).unbind("error").attr("src","{% static 'media/loading.gif' %}");
});
{% for obj in filter_location %}
var url{{obj.city}}="http://maps.googleapis.com/maps/api/staticmap?center={{obj.suite}},{{obj.street}},{{obj.city}}&size=400x200&maptype=roadmap&markers=size:mid|color:green|{{obj.suite}},{{obj.city}}&sensor=true";
$("#map{{obj.city}}").attr("src",encodeURI(url{{obj.city}}));
{% endfor %}
$('#btnNext').click(function(){
window.location.assign("./pickpaymentplan/");
});
});
</script>
<link rel="stylesheet" href="{% static 'css/base.css' %}" />
{% endblock %}
{% block head %}
<h1 class="heading" >Place An Order</h1>
<h4 class="heading">Please choose a location</h4>
{% endblock %}
{% block content %}
<!-- Main Body Content -->
<form id="frmLocation" action="./" method="POST">{% csrf_token %}
<table border="0">
<tr>
<td>
<table border="1" id="location" >
<tr>
<th> </th>
<th>Locations</th>
<th>Map</th>
</tr>
{% if filter_location %}
{% for p in filter_location %}
<tr>
<td><input type="checkbox" id="{{p.location_id}}L" name="{{p.location_id}}L" ></td>
<td>{{p.suite}},{{p.street}},<br/>{{p.city}},{{p.state}},<br/>{{p.country}},{{p.zip}}</td>
<td class="maps" ><img id="map{{p.city}}" /></td>
</tr>
{% endfor %}
{% else %}
<tr></tr>
<tr><td colspan="5">No Locations!</td></tr>
{% endif %}
</table></td>
</tr>
<tr>
<td style="text-align:right"><input type="submit" id="btnNext_picklocation" name="btnNext_picklocation" class="btnNext" value="Next"/> </td>
</tr>
</table>
</form>
</div>
<div id="footer" name="footer">
</div>
{% endblock %}
在这段代码中,我使用了一个 base.html 文件作为基本模板。对 settings.py 进行了适当的更改,例如 static_url、media_url。这个页面仍然没有按预期工作。缩进会是一个问题吗?实施css是否需要遵循一些额外的步骤?