Jquery .on event.trigger在第二次单击时不刷新

时间:2016-01-15 13:41:42

标签: javascript jquery

嗨,我遇到了一个奇怪的行为:

我有一个链接,它将一些数据属性提供给另一个链接(滑块的反向链接)

<div class="col-sm-4 etapes etape1 btn-back"
     data-classtarget="row_containerHover" 
     data-currentcontainerid="row_containerHover2"></div>

和后面的链接代码

$('body').on('click touchstart', '.btn-back', function (e) {
        //$('.btn-back').on('click touchstart', function (e) {

            //console.log('click btn-back');//test ok
            //var container = $(e.target).closest('.slide_containerHover');
            var container = $("#"+$(e.currentTarget).data('currentcontainerid'));
            console.log("current container : "+container.attr("id"));

            var container_class_target = $(e.target).data("classtarget");
            var prev_container = $("#"+container_class_target);
            console.log("prev container : "+prev_container.attr("id"));

            //On récup le niveau du container ds l'arborescence
            /*var level_container = container.data('level');
            var prev_level = parseInt(level_container - 1);*/
            //On récup le container précédent


            var decalX = parseInt(parseInt($(window).outerWidth() / 2) 
                       + parseInt(container.outerWidth() / 2));

            console.log("ledecalX : "+decalX);//test

            container.animate({
                left: "+=" + decalX
            }, 500, 'easeInOutQuad');

            //console.log('row_containerHover outerWidth : '+decalX);//test
            setTimeout(function () {
                prev_container.animate({
                    left: "0px"
                }, 500, 'easeInOutQuad'), 100
            });
         }

第一次没问题,我的数据属性是正确的。当我单击另一个链接时,数据属性在我的html中更改,但控制台测试不显示更改的$(e.currentTarget).data('currentcontainerid')

有没有办法获取$(e.currentTarget)的刷新数据属性?

谢谢大家

2 个答案:

答案 0 :(得分:1)

最后,我在程序结束时使用jquery .removeData删除了它:

 $(e.currentTarget).removeData('classTarget');
 $(e.currentTarget).removeData('currentcontainerid');

现在它就像一个魅力^ _ ^谢谢你的帮助

答案 1 :(得分:0)

您正在寻找dataset而不是data()。使用dataset,您可以设置并获取值。\ / p>

它是如何工作的?

 $(selector).get(0).dataset.currentcontainerid; // returns data-currentcontainerid value
 $(selector).get(0).dataset.currentcontainerid = "new value"; // set the new value

我使用get(0)来返回DOM对象而不是jQuery对象。你可以使用纯javascript:

 document.getElementById("element").dataset.currentcontainerid = "new value"; // set the new value

更多信息:

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/dataset