Question

我有一个页面，其中有多个div通过PHP / MySQL动态生成。 div类名也是动态生成的。

<div class="1er45">Test 1</div>

<div class="25dd58">Test 2</div>

<div class="87f77">Test 3</div>

<div class="87fffas">Test 4</div>

<div class="1er45">Test 1</div> 

<div class="25dd58">Test 2</div> 

<div class="87fffas">Test 4</div> 

<div class="8asdf">Test 5</div>

<div class="25dd58">Test 2</div> 

<div class="87fffas">Test 4</div> 

<div>...</div>

如何修改此jQuery选择器以匹配上面所有动态生成的div类名？如果有多个具有相同类名的div，我只想显示第一个div。

<script>
  $('.classname').not(':first').hide();
</script>

Answer 1

根据我的理解，您可能需要遍历所有div并隐藏所有相同的类名称，而不是1：

$( 'div[class]' ).each( function() {
  $( 'div.' + $( this ).attr( 'class' ).replace( /\s/g, '.' ) + ':gt(0)' ).hide();
});

jsFiddle

Answer 2

我真的没有看到动态生成类的重点。

如果您知道这些“ID”的模式，您可以使用正则表达式来捕获它们。

Answer 3

假设您在每个<div>中只有一个类值，您可以在以下代码中实现您的要求：

var $firstDiv = $("div:first");
var sFirstClass = $firstDiv.attr("class");

if ($("." + sFirstClass).length < 2) {
    $firstDiv.hide();
}

该代码将：

检索第一个div
获取class属性值
检查是否有多个具有class值的元素
隐藏第一个元素，如果没有

Answer 4

遍历每个div，计算每个类名的出现次数。然后，对于每个收集的类名，隐藏重复。

var classNames = {};
$('div').each(function(){ 
    var c = $(this).attr('class'); 
    classNames[c] ? classNames[c]++ : classNames[c] = 1;
});

for (var c in classNames) { 
    if (classNames[c] > 1) 
        $('div.' + c).not(':first').hide();   
}

http://jsfiddle.net/ne770a5g/

如何动态生成jQuery选择器？

4 个答案: