浅谈写H5时遇到的一些小坑吧!

最近在写h5前端,因为是新手所以遇到了一些坑,做个小笔记吧....

关于ajax与form表单:   

当我们在使用button进行onclick调用ajax时,有可能遇到form表单同时提交导致页面重复提交产生bug....

比如以下情况:

这里有两个值得注意的小tips:

1.<input type="submit">按钮不在<form></form>中不会提交表单

2.<button>text<button>相当于submit按钮，在<form></form>中点击，会提交表单

那么我们如何防止form和onclick同时提交捏?

只需要在form表单头加入这一句 

<form onsubmit="return false;">

是的你没有看错就是这么骚的操作,直接防止form提交,真的又简单又暴力,嘤嘤嘤~

 

关于ajax的josn模板:

 

<script type="text/javascript">
    //url为我们访问的地址
    //jsonStr为传送的data数据
    //sendTp 为传送数据类型"GET" or "POST"

    function send(url, jsonStr, sendTp) {
            var jsonArrayFinal = JSON.stringify(jsonStr);//string类型
            $.ajax({
                type: sendTp,
                url: url,
                async: true,//默认异步
                data: jsonArrayFinal,
                contentType: "application/json",
                success: function (data, textStatus) {
                    alert("操作成功!");
                },
                error: function (xhr, status, errMsg) {
                    alert("操作失败!");
                }
            });
        }

  </script>

然后是安利一个懒人框架:LayUI 是由贤心大大开发的一款模块化开发框架,简直不要太好上手~  

传送门:https://www.layui.com/