以利用ajax生成二维码为例,如下图所示:
1)jquery脚本语言的书写格式:引入脚本语言必须单独用<script></script>括起来,不然不会执行jquery代码
<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function () {
})
</script>
2)jquery语言中如何获取变量值:
a)按照页面操作顺序写代码,如图1代码所示,在点击效果之前获取用户输入的值,再实现点击效果-----HTML中不使用Form表单,想利用ajax实现页面局部刷新实现功能,代码执行过程会报错,获取不到用户输入的值。
<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function () {
var no = $('#waybillno').val();
var select = $('#selectCode').val();
$('#query_code').click(function () {
})
})
</script>
b)在点击效果触发后,获取变量值,如图代码所示-----HTML中不使用Form表单,想利用ajax实现页面局部刷新实现功能获取变量的过程必须要在点击效果之后,因为只有当用户有了点击效应,页面才会重新获取值并实现页面刷新,若在点击效果之前获取变量值,获取的是get请求时的值,不能获取到用户操作的值。
<script>
$(function () {
$('#query_code').click(function () {
var waybill_no = $('#waybillno').val();
var select = $('#selectCode').val();
console.log(waybill_no + select)
$.ajax({
type: "POST",
data: {'wayBillNo': waybill_no, 'selectCode': select},
url: "wx_code",
success: function (result) {
data = JSON.parse(result);
console.log(data);
$('#codeImg').attr('src', data);
$('#codeImg').show();
},
error: function () {
alert('请重试!')
}
});
})
})
</script>
切记:1)使用ajax刷新局部页面实现功能:点击查询按钮时,才会刷新页面,才会获取用户输入的数据,所以定义变量要在点击函数里面;
2)ajax中data的key-value注意的 点:1)key值必须用引号;2)多个key-value时,中间用逗号隔开;3)key取自html中的name属性,value对应views.py函数中的name对应的变量值
3)Django的web项目调试:
利用DEBUG工具调试:点击source查看代码,打断点,然后刷新web页面,请求即可实现断点调试
4)html标签中,确保每个标签有唯一的id