当前位置 主页 > 网站技术 > 代码类 >

    jquery获取并修改触发事件的DOM元素示例【基于target 属性】

    栏目:代码类 时间:2019-10-23 21:03

    本文实例讲述了jquery获取并修改触发事件的DOM元素。分享给大家供大家参考,具体如下:

    需求

    当点击关注后,改变按钮样式并显示取消关注,如图

     

     

    实现

    利用jQuery的 target获取到触发该事件的dom,然后修改它

    target 属性

    代码:

    HTML

    <div class="people-desc">
    <div class="people-name">{$vo['nickname']}</div>
    <div class="people-state" οnclick="toFollow({$vo['follow_user_id']})">+关注</div>
    </div>
    
    
    function toFollow(follow_user_id) {
        console.log(event);
        var toUrl = "{:url('index/follow/toFollow')}";
        var postData = {follow_user_id:follow_user_id};
        $.post(
          toUrl,
          postData,
          function (result) {
            if(result.code == 0){
              target.outerHTML = "<div class=\"people-state active\" οnclick=\"toFollow("+follow_user_id+")\">取消关注</div>";
            }else{
              //失败
              layer.msg(result.msg);
            }
          },"JSON");
    }
    
    
    

    更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery常见事件用法与技巧总结》、《jQuery常用插件及用法总结》、《jQuery操作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》

    希望本文所述对大家jQuery程序设计有所帮助。