Jquery与Bootstrap实现后台管理页面增删改查功能示例

使用jquery与bootstrap实现了一个比较简单但功能齐全的增删改查功能的后台管理页面，虽然只是一个CRUD页面，但麻雀虽小五脏俱全，JS常用的功能都用到了，本例用原生的jquery与bootstrap配合使用，不考虑JS的重构性及打包，该例子零耦合，开箱即用。

先看Demo：

一、用到的Jquery功能

1、获取/赋值input输入值

$("#my_id").val();// 获取
$("#my_id").val(“user_id");// 赋值

2、获取/赋值textarea文本域输入值

$("#my_textarea").val();// 获取
$("#my_textarea").val("my_textarea");// 赋值

// 文本域显示默认值，这个和input不一样，不能通过value赋默认值
这里是文本域默认的内容

3、隐藏/显示输入框

$("#my_input").hide();
$("#my_input").show();

4、获取表单form输入的数据

$("#my_input").hide();
$("#my_input").show();

二、示例代码

示例前端active_list.html代码：

  
  
  
  
  

  






  活动列表

  

  总数（{total_count}）

  

  

    
排序
    
显示标题
    
图片链接
    
标签
    
截止时间
    
状态
    
活动详情
    
奖项设置
    
简介
    
备注
    
操作
  
  
  

  
  

    
{order_num}
    
{title}[{active_id}]
    

    
{tag_name}
    
{expire_time}
    
 上架 下架
    
内容编辑
    
 设置奖项
    
{summary}
    
{remark}
    

      编辑
        
    删除
    

  

  


  

  {page_str}       

  

  
    
      
 
   
     ×
   
   

     活动详情
   
 
 
   
     上传封面图片
     


     
   
   
      
    
  

动作处理页面active_action.php

 0 ? 1 : 0;

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。