Question

好的，所以我想在个人资料列表中这样做，你可以点击个人资料，它会突出显示（另一个背景颜色，让我们说黄色）。当你突出显示并按“保存”时，我想以某种方式选择突出显示的配置文件ID并输出它们。

所以我的第一个问题是：

我如何做这样的事情你可以通过点击/取消点击来选择/取消？他们将突出显示。我如何制作一个抓取这些突出显示的配置文件框的选择器？

也许已存在此插件或插件的功能？

否则我如何执行此操作单击/取消选中以突出显示/取消突出显示，然后在警告中输出突出显示的元素的id属性，当您单击“显示您选择的内容”按钮时出现该警告

Answer 1

使用类似的东西：

$('div.profile').click(function(){
    $(this).toggleClass('selected');
});

然后使用div.profile.selected设置css中所选配置文件的样式。然后，当您想要选择突出显示的所有div时，只需使用$('div.profile.selected')。如果您想知道选择了多少，请使用$('div.profile.selected').length。这是一个例子：

http://jsfiddle.net/Paulpro/apvqM/

Answer 2

你试过.toggleClass（）吗？即创建一个css类高亮显示并添加

 $("div").click(function () {
      $(this).toggleClass("highlight");
    });

HTH

Ivo Stoykov

PS：查看文档here

Answer 3

您可以使用jQuery的click功能来标记/取消标记div。

 $("div.profile").click(function () {
     // if it's unmarked we mark
     if(!$(this).hasClass('selected'))
          $(this).addClass('selected');
     else
          $(this).removeClass('selected');
  }

然后，您可以使用each获取所有标记的div：

$("div.selected").each(function () {
    // do what you want
});

对于不显示黑色的方框，它来自height属性后缺少的分号;）

Answer 4

http://jsfiddle.net/vol7ron/5pZ2v/8/

首先，你需要给你的DIV一个ID，然后看看我的小提琴。

$("div").click(function () {
   $(this).toggleClass("highlight");
});

$('#save-button').click(function(){

    $('#output').html('');                           // clear the output div

    // Loop through each selected div and output it's ID
    $('div.highlight').each(function(){
       $('#output').append('<div>' + $(this).attr('id') + '</div>')
    });
});

如何在jQuery中单击并选择div元素

4 个答案: