利用jq獲取數據，然后使用ajax以post請求方式傳送數據 ``` $(function () { $('#save-banner-btn').click(function (event) { event.preventDefault(); var dialog = $('#banner-dialog'); var nameInput = $("input[name='name']"); var imageInput = $("input[name='image_url']"); var linkInput = $("input[name='link_url']"); var priorityInput = $("input[name='priority']"); var name = nameInput.val(); var image_url = imageInput.val(); var link_url = linkInput.val(); var priority = priorityInput.val(); if(!name || !image_url || !link_url || !priority){ zlalert.alertInfoToast("請輸入完整的輪播圖數據！"); return ; } zlajax.post({ 'url':'/cms/abanner/', 'data':{ 'name':name, 'image_url':image_url, 'link_url':link_url, 'priority':priority, }, 'success':function (data) { dialog.modal("hide"); if(data['code'] == 200){ //重新加載頁面 window.location.reload(); }else{ zlalert.alertInfo(data["message"]); } }, 'fail':function () { zlalert.alertNetworkError(); }, }) }); }); ``` 輪播圖數據顯示 ``` <tbody> {% for banner in banners %} <tr> <td>{{ banner.name }}</td> <td><a href="{{ banner.image_url }}" target="_blank">{{ banner.image_url }}</a></td> <td><a href="{{ banner.link_url }}" target="_blank">{{ banner.link_url }}</a></td> <td>{{ banner.priority }}</td> <td>{{ banner.create_time }}</td> <td> <button class="btn btn-default btn-xs">編輯</button> <button class="btn btn-danger btn-xs">刪除</button> </td> </tr> {% endfor %} </tbody> ```