一般情况下我们在模板利用django的for标签循环生成html代码时,可以同时生成形如:
"{% url 'dormitory:hygiene_detail' pk={{ id }} %}"
的url地址,这样很容易就把参数动态的匹配到每一个url中了。
但是,如果html的代码需要js来动态的生成,再用django的for标签就不合适了。
因为for标签运用在js里,会生成大量的js代码。
因此,这就需要使用json.dumps()来把后台的dict数组转化成json数组,再在模板中使用safe过滤器来获取json数据,获取了json数据,剩下的事交给js就可以了。
但是,这种情况下,我遇到了一个头疼的问题,那就是url不能使用以下方式来传递参数了。
"{% url 'dormitory:hygiene_detail' pk={{ id }} %}"
这个时候我就想到了使用后台来传递url地址:
"href": "{% url 'dormitory:hygiene_detail' pk=" + str(id) + " %}"
这样在前台遍历json数组的时候就可以拿到href属性。
for(var i in {{ dormitory_list|safe }}){ var item = dormitory_list[i]; str += '<div class="dormitory-number color-0082fe" is_checked="1" href="' + item.href + '">' + item.number + '</div>'; }
在click事件里面拿到href属性实现跳转:
$('.dormitory-number').on('click', function(e){ if($(e.target).attr('is_checked') == '1'){ window.location.href = $(e.target).attr('href'); } }
...
什么?你以为这样就万事大吉了?NO NO,接下来我又发现在模板中接收到的这个url参数是个静态字符串,并未解析:
alert(url);
显示:{% url 'dormitory:hygiene_detail' pk=10 %}
想要得到的渲染结果应该是:/dormitory/hydiene_detail/10/
解决方法就是在后台传递href参数时,使用Django的Template处理一下即可:
from django.template import Context, Template ctx['dormitory_list'].append({ "number": 100, "is_checked": 1, "id": id, "href": Template("{% url 'dormitory:hygiene_detail' pk=" + str(id) + " %}").render(Context()) })
最后一步,在click事件里面实现跳转:
$('.dormitory-number').on('click', function(e){ if($(e.target).attr('is_checked') == '1'){ window.location.href = $(e.target).attr('href'); } }
到此就万事大吉啦!
附:
E:\qiye (gengleiming) λ manage.py shell Python 2.7.11 (v2.7.11:6d1b6a68f775, Dec 5 2015, 20:40:30) [MSC v.1500 64 bit (AMD64)] Type "copyright", "credits" or "license" for more information. IPython 5.0.0 -- An enhanced Interactive Python. ? -> Introduction and overview of IPython's features. %quickref -> Quick reference. help -> Python's own help system. object? -> Details about 'object', use 'object??' for extra details. In [1]: from django.template import Context, Template In [2]: t = Template('My name is {{ name }}.') In [3]: c = Context({'name': 'nowamagic'}) In [4]: t.render(c) Out[4]: u'My name is nowamagic.' In [5]: