css 覆盖样式及ajax填充表格，不跳转提交

110 阅读 0 评论 73 点赞

我是靠谱客的博主个性龙猫，这篇文章主要介绍css 覆盖样式及ajax填充表格，不跳转提交，现在分享给大家，希望可以做个参考。

复制代码

1
2
3
4
5
<style>
div.content{
background-color: #4fbd4f!important;
}
</style>

复制代码

1
2

复制代码

1
2

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151






<div id="tabs-3">



<table id="tbData" class="table table-bordered">



<colgroup>



<col style="width:25%">



<col style="width:25%">



<col style="width:50%">



</colgroup>



<tr>



<th>Host</th>



<th>User</th>



<th>类型</th>



</tr>



<tbody>



</tbody>


</table>






</div>


<div id="tabs-4">






<button id="btn_submit">重新查询</button>



<div id="bbbb"></div>



<script language="javascript">



$('#btn_submit').click(function(){



$("#bbbb").html('正在查询....');



$.get("/deployed",function(data,status){



$("#bbbb").html('查询结束');


console.log(data);


$("#tbData tr td").remove();


console.log("has removed all");



var tempHtml = "";



for(var i = 0; i< data.length; i++)



{



tempHtml += "<tr><td>"+data[i]["host"]+"</td><td>"+data[i]["user"]+"</td><td>"+data[i]["type"]+"</td></tr>";



}



$("#tbData").append(tempHtml);


});






});



</script>
不跳转提交：

复制代码

1
2
1
return false;

复制代码

1
2
2
function submit() {

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54

$('#formid0').off().on('click', function () {


$.ajax({


cache: false,


type: "POST",


url: "/ip_host_detail",


data: $('#formid0').serialize(),


async: true,


success: function (data) {


if (data.status == 'success') {


$('#formid0')[0].reset();


alert("提交成功")


} else if (data.status == 'fail') {


$('#formid0').html(data.msg)


}


}


});


});


}