前端页面和js

小知识

1. js在执行时,如果不需要往下执行,需要返回,注意return false
   2.按钮等样式加上 disabled 就会变得不可用
2. history.go(0)的用法,也可以用来刷新数据的,可以提交后使用他会刷新数据的变化

表单提交的几种方法

1.submit方式

<input type="submit" value="登录">

2.js改变表单提交的路径

<form role="form" action="#" method="get" th:action="@{/url1/}" id="myFrom">
	<button type="button" onclick="exportlist();">button</button>
</form>

JS内容
<script type="text/javascript">
    function exportlist(){
        document.forms.myFrom.action="/url2";
        document.forms.myFrom.submit();
    }
</script>

3.ajax提交

 <script type="text/javascript">
        function login() {
            $.ajax({
            //几个参数需要注意一下
                type: "POST",//方法类型
                dataType: "json",//预期服务器返回的数据类型
                url: "/users/login" ,//url
                data: $('#form1').serialize(),
                success: function (result) {
                    console.log(result);//打印服务端返回的数据(调试用)
                    if (result.resultCode == 200) {
                        alert("SUCCESS");
                    }
                    ;
                },
                error : function() {
                    alert("异常！");
                }
            });
        }
    </script>

超链接触发function并获取超链接的值

<a class="b04 co01" href="#" onclick="find(this.innerHTML)">郝</a>
function find(label) {
    alert(label)
}

div的边距

设下边距为10像素

设上边距为10像素

对一个div点击事件并跳转 .(class)

 $(".t_btn6").click(function(){
    window.location.href="<%=basePath%>/reportForm/toAllComment.do";
});

echarts高看一点的图表和现成的页面，需要直接拿去

第一个页面
https://download.csdn.net/download/weixin_43283487/10907708

第二个
https://download.csdn.net/download/weixin_43283487/10907716

第三个https://download.csdn.net/download/weixin_43283487/10907718

*

分页展示

我觉得这种样式的分页要好看很多,带页面布局全部上传,需要拿去
https://download.csdn.net/download/weixin_43283487/10908530

错误页面

https://download.csdn.net/download/weixin_43283487/10908448

3D标签云
https://download.csdn.net/download/weixin_43283487/10908457

bootstrap的一套页面
https://download.csdn.net/download/weixin_43283487/10908596