data- *不会更新后点击

我想更新data-coords（第11行），但是当我这样做代码运行但data-coords不更新。为什么？它看起来对我有效，我错过了什么？data- *不会更新后点击

$(document).on('click', '.next-prev-js', function (e) { 
    var item = e.target; 
    if($(item).is("img") && tagging){ 
     var offset = $(item).offset(); 
     var imgid = $(item).attr("data-image-id"); 
     var obi = $("#blackout-image").offset(); 
     x = (e.clientX - offset.left); 
     y = (e.clientY - offset.top); 
     addTag(e.clientX - obi.left - 55, e.clientY - 55); 
     saveCoords(x, y, imgid); 
     $(item).attr("data-coords", x+","+y); 
     tagging = false; 
     $(".tag-self").text("Tag yourself"); 
     $("#blackout-image img").css({cursor: "pointer"}); 
     $("#blackout-image .face").delay(3000).fadeOut("fast"); 
     return false; 
    } 
    var action = $(item).attr("data-action"); 
    nextPrevImage(action); 
    return false; 
});

下面是HTML部分（这是一个PHP的echo语句中）：

<a class='thumb-photo' href=''> 
    <img class='thumb-img' data-coords='$x,$y' data-id='$id' data-image-id='$imid' data-file='$f' src='/user-data/images/image.php?id=$id&file=$f&height=240&width=240' width='240' height='240' /> 
</a>

演示

（在此过程中，不要刷新页面）

如果您点击其中一个图像，它将在查看器中打开。

超过左侧悬停“他在哪里”和一个方形将展示该数据COORDS是（从缩略图）
的“标签自己”接下来点击，然后点击的位置图片。
按“ESC”键或再次
点击图片点击透明区域关闭浏览器，鼠标移到“哪里是他的” COORDS仍然是老COORDS，但他们应该在你已经更新在新的位置点击

http://wows.phpsnips.com/profile.php?id=1&tab=photos

来源

2013-02-17 Get Off My Lawn

什么是“标记”，if条件匹配是什么？你怎么看它没有更新？ – Bergi 2013-02-17 18:34:11

它是一个布尔值，当你点击“标记自己”后，它将被设置为“true”，因此当你点击图像时它不会进入下一个图像（这是默认操作）。 – 2013-02-17 18:35:28

显示savecoords功能？ – 2013-02-17 19:00:59

您应该使用data方法。

$(item).data({coords: x+","+y});

或

$(item).data("coords", x+","+y);

作品的jsfiddle。

您可以看到您的数据属性：

console.log($(item).data());

来源

2013-02-17 18:33:09 Kaeros

我有，它仍然不起作用 – 2013-02-17 18:33:51

真的吗？只有“坐标”？好的，这很奇怪。 :) – Kaeros 2013-02-17 18:35:06

是的，这是正确的。 – 2013-02-17 18:37:22

的方式data-属性的工作是价值被复制到页面加载jQuery的数据对象。之后，他们不再真正连接在一起了。所以如果你改变属性，对象不会自动更新。相反的。

我做了一个简单的测试来证明的行为：

的jQuery：

var $d = $('div'); 
alert('Load: Attribute "a" gets copied to data object.\rData Attribute: ' + $d.attr('data-test') + '\rData Object: ' + $d.data('test')); 

$d.attr('data-test','b'); 
alert('Changed attribute to "b". Attribute changed, object still "a".\rData Attribute: ' + $d.attr('data-test') + '\rData Object: ' + $d.data('test')); 

$d.data('test','c'); 
alert('Changed data object to "c". Object changed, attribute still "b".\rData Attribute: ' + $d.attr('data-test') + '\rData Object: ' + $d.data('test'));

演示：
http://jsfiddle.net/F5qkq/

所以你的情况，你只更改数据属性与attr但这样内部数据对象保持不变b因为他们没有联系了。

数据属性仅用于使用startvalue初始化数据对象。但之后，如前所述，您应该只使用jQuery的data函数来更改内部数据对象。

来源

2013-02-17 18:57:21 Andy

但是，它不会在DOM中修改它，并且每次点击拇指时，我都会重新读取DOM中的坐标。所以不应该不重要？ – 2013-02-17 19:08:28

data- *不会更新后点击

回答

相关问题