Question

我在使用jquery在<ul>中迭代jquery元素时遇到问题，问题是我有一个简单的菜单，当我点击{{1}链接时我需要获取链接的值功能。

filter()

以下代码

<div class="panel-content">
<ul class=" filters-option">
<li class="category"><a value="1">CAT1<small>(722)</small></a></li>
<li class="category"><a value="2">CAT2<small>(722)</small></a></li>
<li class="category"><a value="3">CAT3<small>(722)</small></a></li>
</ul>
<a onclick="filter()" class="test button btn-mini col-md-12">Filtrar</a>
</div>

我如何解决这个问题？还有其他可能的解决方案吗？

Answer 1

使用$.each循环遍历这些元素

function filter(){
  tjq('ul.category li a').each(function(){
    var val = $(this).attr('value');
    alert(val);
  });
}

请注意，这不是有效的HTML，您可能应该使用data- attribute或href来存储值，但这仍然有用。

Answer 2

试试这个：

$(document).ready(function(){

    $("a.col-md-12").on("click",function(){

        $(".category a").each(function(){

            alert($(this).attr("value"));

        })

    })

})

最终代码：

<!DOCTYPE html>
<html lang="en">
<head>
</head>
    <body>
        
        <div class="panel-content">
            <ul class=" filters-option">
            <li class="category"><a value="1">CAT1<small>(722)</small></a></li>
            <li class="category"><a value="2">CAT2<small>(722)</small></a></li>
            <li class="category"><a value="3">CAT3<small>(722)</small></a></li>
            </ul>
            <a class="test button btn-mini col-md-12">Filtrar</a>
        </div>
        
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
       <script>

        $(document).ready(function(){

            $("a.col-md-12").on("click",function(){

                $(".category a").each(function(){

                    alert($(this).attr("value"));

                })

            })

        })
            
       </script>
    </body>
</html>

如何迭代活动项目

2 个答案: