获取ajax动态加载的多个a标签中的 点击的那个a标签对应的值

复制代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.special_color{
font-size:16px;
color:#006633;
font-family:"微软雅黑";
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
</head>
<body>
<div class="search_sort">
    <li><a href="#" class="special_color">全部</a></li>
    <li><a href="#">前沿技术</a></li>
    <a href="#">原创</a>
    <a href="javascript:void(0);" onclick="js_clear()"  >翻唱</a>
    <a href="javascript:void(0);" onclick="js_clear()"  >kkk</a>
</div>
<div class="classify">
    
</div>


<script type="text/jscript">
    $(function(){
        var tit = '';
        
        getClassify("");
                
        // $('.search_sort li a').click(function(){
        //     alert($(this).text());//输出所点的a的内容
        //     tit = $(this).text();
        //     alert(tit);
        //     getClassify(tit);
            
        // })
        
        
        //  获取ajax中动态 点击的a标签的值 
        $(".classify").on("click","li>a",function(){
            alert("被点击了");
            alert($(this).text())
        })
        // $(".classifyyy a").on("click", function(){
        // alert( $(this).text() );
        // });
        
        // $('.classifyyy li a').click(function(){
        //     alert($(this).text());//输出所点的a的内容
        //     tit = $(this).text();
        //     alert(tit);
        //     getClassify(tit);
            
        // })
    });
        function getClassify(tit){
            $.ajax({
            
                url:"http://localhost:8080/selectClassifyAllOrByDirectionid",
                data:"describee="+tit,
                success:function(Classify){
                    var li1 = '<li class="course-nav-item on"><a href="#">全部</a></li>';
                    var li2 ='';
                    for (var i = 0 ; i < Classify.length ; i++) {
                        li2 += '<li class="course-nav-item "><a href="#" data-id="6303" data-ct="tyscript">'+Classify[i].classifyname+'</a></li>';
                    }
                    
                    var li3 = li1 + li2 ;
                    $(".classify").append(li3);
                }
            });
        }
        
        
    
</script>
</body>
</html>
复制代码

 

2.$(document).on(‘click’,‘要选择的元素’,function(){})
　　 on方法包含很多事件，点击，双击等等事件。和$().click()的用法一样，最大的区别即优点是如果动态创建的元素在该选择器选中范围内是能触发回调函数。

posted @   ixfcao  阅读(894)  评论(0)  编辑  收藏  举报
编辑推荐：
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
阅读排行：
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型，支持深度思考和联网搜索！
· 基于 Docker 搭建 FRP 内网穿透开源项目（很简单哒）
· ollama系列01：轻松3步本地部署deepseek，普通电脑可用
· 按钮权限的设计及实现
· 25岁的心里话
点击右上角即可分享
微信分享提示
AI IDE Trae
主题色彩