使用jquery的数据属性来关联两个元素

我在jQuery中学到的第一件事情是Click()函数，以及获取一个元素来影响另一个元素的好处。但是，当我有一组项目（遍布在我的文档中）时，我应该怎么做才能使整个'更多的元素数组再次散布在我的文档中？使用jquery的数据属性来关联两个元素

在我奇怪的想法中，我想使用数据属性。你可以在这里看到一个非常简化的版本：http://jsfiddle.net/Qnzpg/

首先，我在jsfiddle上的例子有很多更好的解决方案，我知道。但是，真正的应用程序有点复杂，需要这种方法。

我试图通过作为变量我的数据属性的值，并且具有共享变量来实现的元件（在我的例子，通过具有将其添加一个类）：

$("#menu [data-cell]").click(function (e){ 
    e.preventDefault; 

    //make the data value a variable 
    var $cell = $(this).data(); 

    //find the other element with the same data value and add the class named "open" 
    $('#pages [data-cell='$cell']').addClass('open'); 
});

我我已经很长时间一直在和我的jQuery一起摆弄，感觉最好是打电话给专家。

我在做什么错了？

来源

2013-11-05 invot

有什么问题串连$细胞？ –

在这里你去：

$('#menu li a').each(function() { 
    $(this).click(function() { 
     var attr = $(this).parents('li').attr('data-cell'); 
     $('#pages div').each(function() { 
      $(this).removeClass('open'); 
      if($(this).attr('data-cell') == attr) { 
       $(this).addClass('open'); 
      } 
     }); 
    }); 
});

小提琴：http://jsfiddle.net/Qnzpg/7/

来源

2013-11-05 02:01:40

这里有什么运气？我很想知道这是否适用于你:) –

虽然这在我的实际应用程序中不起作用，但这帮助我了解了我做错了什么。我想知道你为什么决定使用'.each（）'。你能解释为什么这会使事情发挥作用吗？ – invot

嗨@invot，感谢您的反馈。 http://api.jquery.com/each/是一个循环结构，允许您为每个项目（在本例中为每个链接）设置上下文，然后将随后的代码与该上下文相关联。您可以像这样读取它：对于每个链接，单击时，将指定的属性存储为变量...然后为每个指定的div检查相同的属性变量并执行一些操作。 –

您没有正确的语法为您的字符串连接，我觉得你要抢只为data-cell属性的值。

var $cell = $(this).data('cell'); 
$('#pages [data-cell="' + $cell + '"]')

虽然为了安全起见，我用双引号将选择器值封装起来以防数据有空间。

来源

2013-11-05 02:02:07

我做了修改你的代码，现在可以正常运行

那么首先我认为你是错的，因为你没有串联变量$细胞，但我意识到以后你不要让ATTR数据单元格，你需要得到的数据单元这样的值：

var $cell = $(this).attr('data-cell');

，需要这样的

$('#pages [data-cell='+$cell+']').toggle('open');

来源

2013-11-05 02:04:11 godie

使用jquery的数据属性来关联两个元素

回答

相关问题