V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
boyhailong
V2EX  ›  前端开发

jquery 用法困惑

  •  
  •   boyhailong · 2016-09-09 15:28:51 +08:00 · 1818 次点击
    这是一个创建于 3025 天前的主题,其中的信息可能已经有所发展或是发生改变。

    功能很简单:送货地址的增删改,客户端使用 ajax ,增加的时候使用 ajax ,在 success 回调里根据服务器返回的数据添加新的收货地址,比如:

       function addAddress(name, detail_address, email, phone_number
       , province, city, region, address_id) {
           var addressliHtml = '<li id=addr-li-' + address_id + '>'+
                '<p><em class="name">' + name + '</em>(<em class="phone">' + phone_number + '</em>)</p>' +
                ' <p class="all-address">' + province + '&nbsp;' + city + '&nbsp;' + region + '&nbsp;' + detail_address + '</p>' +
                '<p><em class="email">'+email+'</em></p>'+
                '<p class="new_line"><br></p>' +
                '<p class="address_action">' +
                '<span><a href="#" class="edit float_none" id=edit-addr-' + address_id  + '><i class="edit_icon"></i>修改</a></span>' +
                '<span><a href="#" class="delete float_none" id=delete-addr-' + address_id  + '><i class="delete_icon"></i>删除</a></span>' +
                '</p>' +
                '</li>';
            $("#addresslist").prepend(addressliHtml);
       }
    

    这样显示上没问题,但是当点击 edit-addr-**的时候,获取对应的 address_id 却一直是固定的数字 2. 点击的事件是这样的:

    $("#addresslist").on("click","a[id^=edit-addr-]", function (event) {
            event.preventDefault();
            //此处 address_id 一直获取不正确
            var address_id = $(this).attr('id').split('-')[2];
        });
    

    表示非常不解,是中间哪个地方出问题了吗?

    当然直接网页显示的地址,点击事件里获取 address_id 是没问题,只有 ajax 里动态添加的数据有问题。

    哪位大神知道呢?

    6 条回复    2016-09-09 17:09:57 +08:00
    sorra
        1
    sorra  
       2016-09-09 15:43:32 +08:00
    审查元素里看到的元素 id 是什么?
    然后,咋不 debug 一下?
    boyhailong
        2
    boyhailong  
    OP
       2016-09-09 15:49:27 +08:00
    @sorra 额 debug 了 服务器返回的数据有问题 问题关闭了。。。。。 感谢
    jjplay
        3
    jjplay  
       2016-09-09 15:49:42 +08:00
    你的 ID 获取方式 和 HTML 字符拼接 提升了整个简单的流程的难度...
    boyhailong
        4
    boyhailong  
    OP
       2016-09-09 15:50:14 +08:00
    @jjplay 那怎么做会简化呢
    rain0002009
        5
    rain0002009  
       2016-09-09 16:18:56 +08:00
    就不能用 html 的 data 存 id 么 data-id='xxx'什么的
    jjplay
        6
    jjplay  
       2016-09-09 17:09:57 +08:00
    @boyhailong
    https://github.com/aui/artTemplate
    https://github.com/PaulGuo/Juicer

    用模板,直接将变量在模板中替换 即可。
    多数据的时候非常方便
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2943 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 08:19 · PVG 16:19 · LAX 00:19 · JFK 03:19
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.