js使用技巧总结
1,onclick有效是结合alter弹出框
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> function send_mail(){ alert("Click button"); } </script> </head> <body> <input type="button" onClick="send_mail()" value="button"/> </body> </html>
2,document.getElementById('id') 和 document.getElementsByName('name')
因为id是唯一的,所以document.getElementById('id') 得到的是单个元素,document.getElementsByName('name')得到的是一个数组,可以for循环取得数组的每一个值。
3,学些下这个
<table class="table table_pos" id="tb">
<!--<caption font-size="500">被拦截的邮件详细信息</caption>-->
<thead>
<tr>
<!--<th style=" auto">#</th>-->
<th style=" auto">时间</th>
<th style=" auto">标题</th>
<th style=" 10px">发件人</th>
<th style=" auto">动作</th>
<th style=" auto;visibility:hidden">message_id</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
window.onload = function () {
var datanav = {{ mail_detail_list |safe }}; ##mail_detail_list是一个列表,列表元素是字典
var tb = document.getElementById("tb");
for (var i = 0; i < datanav.length; i++) {
var row = tb.insertRow(tb.rows.length);
var c1 = row.insertCell(0);
c1.innerHTML = i+1; //编号
var c2 = row.insertCell(1);
c2.innerHTML = datanav[i].time;
var c3 = row.insertCell(2);
c3.innerHTML = datanav[i].title;
var c4 = row.insertCell(3);
c4.innerHTML = datanav[i].sender;
var c5 = row.insertCell(1);
c5.innerHTML = user_dropdown_memu;
var c6 = row.insertCell(5);
c6.innerHTML = datanav[i].message_id
}
}
4,得到textarea中的内容:
var content = document.getElementById('add_address_list').value;
采用jquery方式 取值 方法如下:
var content = $("#add_address_list").val()
同理,点击按钮,重置或者清空textarea中的数据
function ClearTextArea() { document.getElementById("user1").value=""; }
或者
function clean(){ $("#user1").val(""); }
5,js 数组,字符串,json互相转换
数组转字符串
var arr = [1,2,3,4,'巴德','merge']; var str = arr.join(','); console.log(str); // 1,2,3,4,巴德,merge
字符串转数组
var str = '1,2,3,4,巴德,merge'; var arr = str.split(','); console.log(arr); // ["1", "2", "3", "4", "巴德", "merge"] 数组 console.log(arr[4]); // 巴德
字符串转数组,数组转数组格式化,数组格式化转数组
var str = '1,2,3,4,巴德,merge'; var arr = str.split(','); var strify = JSON.stringify(arr); console.log(arr); // ["1", "2", "3", "4", "巴德", "merge"] 数组 console.log(arr[4]); // 巴德 console.log(strify); // ["1", "2", "3", "4", "巴德", "merge"] 字符串 var arrParse = JSON.parse(strify); console.log(arrParse); // ["1", "2", "3", "4", "巴德", "merge"] 数组
6,js中字符串拼接
var lang = "Java"; lang = lang + "Script";
7,判断字符串是否为空 if (str.length != 0) {}
8,判断字符串是否相等 if (name == "uname") {}
AJAX 专区
1,traditional默认是false,如果此时提交的数据是{"add_key":[11,22,33,44]},那么django的request.POST收到的是
<QueryDict: {u'add_key[]': [u'11', u'22', u'33',u'44']}>
导致request.POST.get('add_key')无法获取值(因为现在的key是add_key[] )
处理方法是在ajax体中添加
traditional: true,
django中views.py中的字典、列表传到前端js
把django
的views.py
中的值用json.dumps(data)
通过{{data|safe}}
很轻松传进javascript
里
参考:
Django:之传递数据给JS、Ajax和Ajax CSRF认证
js中完成操作想把值(数组)传回views.py
和数据库
用Ajax
,Ajax
有很多种写法,包括JQuery
和JS
,这里贴一个用JQuery
写的最通用的Ajax
,POST
方法传递JSON
格式数据:
$.ajax({ url: "your url", data: JSON.stringify({ // JSON格式封装数据 name: xxx, age: xx }), contentType: 'application/json', type: "POST", traditional: true, // 需要传递列表、字典时加上这句 success: function(result) { } fail: function(result) { } });
然后view.py
里接收以上数据时,由于这里我用了JSON
格式传递,因此需要反序列化:
# coding=utf-8 import json def func(request): json_receive = json.loads(request.body) name = json_receive['name'] age = json_receive['age'] ...
如果不想在JS
里转换格式,直接传递的话,view.py
中这么写:
# coding=utf-8 def func(request): # 如果Ajax使用了GET方法,把下面的POST换成GET即可 name = request.POST['name'] age = request.POST['age'] ...