Question

我有一个图表，根据点击的状态显示数据。当我想要x表示状态时，我想删除那些我正在做的数据，但是我也希望将与该列对应的状态恢复到空闲状态（未突出显示）。现在，每个州都定义了其缩写的ID。

我的[新手jQuery]方法是在状态列div中设置一个数据值，该数据值将匹配状态的div，因此我可以选择它并将其填充颜色更改回空闲状态。使用下面的代码将原来的祖父母数据值记录为未定义的，应该是状态缩写

var $getStateColumn = $(this).closest('div').data('value');
console.log($getStateColumn);

我的[非常迂回]方法的任何解决方案？

编辑：为了时间，我只输入了NY，FL，AL，GA，CA和AK的数据

小提琴：https://jsfiddle.net/yurtqy87/10/

Answer 1

您的代码的问题是$(this).closest('.pick')为您提供div的基础HTML，而不是包含div的HTML。因此，您将无法使用id = 'XX-state-column'定位div。要修复它，您需要使用outerHTML属性来生成所有内容（包括容器元素）。

 $(this).closest('.pick')[0].outerHTML;

通过这样做你将获得div容器但不是正确的容器，因为在你点击事件中，你再次通过.html（）分配innerHTML

修复它的最简单，最简单的方法是为每个状态引入另一个属性，然后在单击时将其解压缩以获取地图容器的ID。

<li class="state-title-chosen univers-bold">
                        <span class="close-state" map-id="NY">X</span>New York
                    </li>

var $state_map = $(this).attr("map-id");
        $("#" + $state_map).css('fill', '');

工作解决方案：https://jsfiddle.net/yurtqy87/12/

伟大的祖父母数据属性未定义

1 个答案: