前臺頁面
復制代碼 代碼如下:
head runat="server">
title>無標題頁/title>
script src="Js/jquery-1.5.1.min.js" type="text/javascript">/script>
script src="Js/Demo.js" type="text/javascript">/script>
/head>
body>
form id="form1" runat="server">
div id="content">
table>
asp:Repeater ID="Repeater1" runat="server">
HeaderTemplate>
tr>
td>
input type="checkbox">
/td>
td>
學生ID
/td>
td>
學生姓名
/td>
/tr>
/HeaderTemplate>
ItemTemplate>
tr>
td>
input type="checkbox">
/td>
td style="text-align: center">
%#Eval("studentId") %>
/td>
td style="text-align: center">
%#Eval("name") %>
/td>
/tr>
/ItemTemplate>
/asp:Repeater>
/table>
/div>
div>
input id="btnDel" type="button" value="刪除">/input>
/div>
/form>
/body>
后臺
復制代碼 代碼如下:
protected void Page_Load(object sender, EventArgs e)
{
StudentBll _bll = new StudentBll();
if (Request.QueryString["id"]!=""Request.QueryString["id"]!=null)
{
string _ids = Request.QueryString["id"];
_bll.Delete(_ids);
}
Repeater1.DataSource = _bll.SelectALL();
Repeater1.DataBind();
}
Demo.js文件
復制代碼 代碼如下:
$(function() {
// 此函數是去掉javascript中字符串的開頭和結尾的空格和換行
function Trim(str)
{
var statrIndex;
var endIndes;
for(i=0;istr.length;i++)
{
var k=str.charAt(i);
if (k!="\n"k!=" ")
{
statrIndex=i; break;
}
}
for (i=str.length-1;istr.length;i--)
{
var k=str.charAt(i);
if (k!="\n"k!=" ")
{
endIndes=i; break;
}
}
return str.substring(statrIndex,endIndes+1);
};
$("#btnDel").click(function(){
var ids="''";
$("#content input:checked").parent().next().each(function(i){
ids=ids+",'"+Trim($(this).text())+"'";
});
$("#content").load("Default.aspx?id="+encodeURI(ids)+"#p-Getting-Started #content") //局部更新Repeater
})
})
源碼下載
您可能感興趣的文章:- jQuery實現checkbox即點即改批量刪除及中間遇到的坑
- PHP批量刪除jQuery操作
- PHP jQuery+Ajax結合寫批量刪除功能
- jquery Easyui Datagrid實現批量操作（編輯，刪除，添加）
- jquery ajax實現批量刪除具體思路及代碼
- jQuery+Datatables實現表格批量刪除功能【推薦】
