Django + jQuery+ ajax 三角形测试计算的动态显示(及部分讲解)
项目功能: 输入三个边长,可实时得到结果,查看是否为三角形。
首页:
HTML代码:
这里我用的div,from的坑有点多,{% csrf_token %} 是必须要写的,不写会报错
<div style="padding-left: 190px;padding: 3em 5em;background: #F2F2F2;">
{% csrf_token %}
<li class="form_li">
<input type="text" placeholder="边长1" name="side1" class="side1"><br><br>
</li>
<li class="form_li">
<input type="text" placeholder="边长2" name="side2" class="side2"><br><br>
</li>
<li class="form_li">
<input type="text" placeholder="边长3" name="side3" class="side3"><br><br>
</li>
</div>
<div id="results" class="form_li">
<input type="text" placeholder="测试结果" name="name4" class="results" style="color: black;"
disabled="disabled"><br><br>
</div>
jQuery+ajax部分:(可复制粘贴部分)
$(document).ready(function () {
function refresh() { 这里写ajax要执行的部分 }
<script>
$(document).ready(function () {
function refresh() {
$.ajax({
url: 'http://127.0.0.1:8000/triangle/result_test/',
type: 'GET',
data: {
'side1': $('.side1').val(),
'side2': $('.side2').val(),
'side3': $('.side3').val(),
},
success: function (context) {
$('.results').val(context)
}
})
}
setInterval(refresh, 1000) #动态刷新设置
})
</script>
views.py部分:(可复制粘贴部分)
result函数是个计算过程代码,triangles和result_test是views主体
def triangles(request):
return render(request,'index.html',{})
def result_test(request):
info = request.GET
side1,side2,side3 = info['side1'],info['side2'],info['side3']
context = {'result2':result(int(side1),int(side2),int(side3))}
print(context)
return HttpResponse(context['result2'])
def result(a=0,b=0,c=0):
a1, a3 = min(a, b, c), max(a, b, c)
a2 = sum([a, b, c]) - a1 - a3
if a1+a2 <= a3:
return '{}+{}的和必须要大于{}哦!'.format(a1,a2,a3)
elif a3-a2 >= a1:
return '{}+{}的差值必须要小于{}哦!'.format(a3,a2,a1)
elif a==b and b==c and a==c:
return '确认成功,这是个等边三角形!'
elif a==b or b==c or a == c:
# print(a**2,b**2,c**2)
if a**2+b**2 == c**2 or b**2+c**2 == a**2 or a**2+c**2 == b**2:
return '确认成功,这是个等腰直角三角形!'
return '确认成功,这是个等腰三角形!'
else:
# print( a1 ** 2 , a2 ** 2 ,a3 ** 2)
if a1 ** 2 + a2 ** 2 == a3 ** 2:
return '确认成功,这是个直角三角形!'
return '确认成功,这是个毫无特点的三角形!'
urls.py:(可复制粘贴部分)
from django.urls import path
from . import views
urlpatterns = [
path('/', views.triangles),
path('/result_test/',views.result_test,name='result_test'),
]
结果: