使用jquery從項目列表中選擇多個項目而不使用複選框

我有一個搜索項目列表。使用jquery從項目列表中選擇多個項目而不使用複選框

這個列表（說，10）項目我最初想要使用每個項目的複選框。

因爲我想讓我很容易標記多個項目，然後按下「刪除選定」按鈕。

但是有沒有辦法使用複選框？我更喜歡以某種方式選擇和取消選擇項目和項目行的背景顏色更改。

我聽說過jquery，但所有我從谷歌搜索「選擇多個jquery」都是如何在選擇列表中使用jQuery的命中。這與我所尋找的不同。

含義我不想要一個選擇列表。

我的項目列表是在表格標籤或div標籤中生成的。

現在使用php。

來源

2009-08-09 Kim Stacks

您可以使用允許多選的選擇列表。例如：

<select name="foo" size="20" multiple> 
    <option value="...">...</option> 
    ... 
</select>

這樣做的另一種方法是使用表並使用一些相當基本的Javascript/jQuery創建該功能。有了這張表：

<table id="select"> 
<tr> 
    ... 
</tr> 
... 
</table> 
<input type="button" id="delete" value="Delete Selected Items">

使用：

$(function() { 
    $("#select tr").hover(function() { 
    $(this).addClass("hover"); 
    }, function() { 
    $(this).removeClass("hover"); 
    }).click(function() { 
    $(this).toggleClass("selected"); 
    }); 
    $("#delete").click(function() { 
    $("#select tr.selected").remove(); 
    }); 
});

這個CSS：

#select { border-collapse: collapse; } 
#select tr td { background-color: white; color: black; } 
#select tr.hover td { background-color: yellow; color: black; } 
#select tr.selected td { background-color: blue; color: white; }

來源

2009-08-09 14:52:49 cletus

我非常喜歡這個，但是你提供的第一個答案明確地表明瞭他所說的他試圖避免的。你的第二個答案似乎正確，但沒有解決在單擊刪除選定按鈕時如何重新選擇項目。 – tvanfosson 2009-08-09 15:02:08

他只說他想避開復選框。我沒有看到任何違反名單的事情。 – cletus 2009-08-09 15:07:18

我沒有提到我不在尋找選擇名單。查看第二行最後一行：我聽說過jquery，但所有我從谷歌搜索「選擇多個jquery」都是如何在選擇列表中使用jQuery的命中。這與我所尋找的不同。我想我會再增加1行來清除。無論如何，我欣賞所做的努力。謝謝。 – 2009-08-10 07:37:30

嘗試這樣使用JavaScript/jQuery的：

function SelectAllTableCheckboxes(tableName, checked) 
{ 
    $('#' + tableName + ' >tbody >tr >td >input:checkbox').attr('checked', checked); 
};

來源

2009-08-09 14:58:56

此外，檢查出jQuery UI的Selectable。然後，您可以使用無序列表，拖動鼠標將選擇多個列表。例如，從Wrox's Beginning JavaScript and CSS with jQuery下載代碼並查看第12章的代碼。

來源

2009-08-09 15:09:42

使用jquery從項目列表中選擇多個項目而不使用複選框

回答

相關問題