我正在使用David Lynch的jQuery maphilight（http://davidlynch.org/projects/maphilight/docs/）突出显示图像上的图像地图区域。特别是，此演示（http://davidlynch.org/projects/maphilight/docs/demo_features.html）显示了如何设置data-maphilight =“ {'alwaysOn：true'}”，以便给定的地图区域“始终处于打开状态”。
我想基于单击的项目设置“始终打开”。所以我尝试了这个：
$(this).attr('data-maphilight', '{\'alwaysOn\':true}');
使用Firebug，我可以看到单击该属性时将其添加到我的元素中，例如：
<area data-county="Susquehanna" href="#" coords="589,62,590,117,518,118,511,62" shape="poly" data-maphilight="{'alwaysOn':true}">
但是，该元素不会保持突出显示状态。
如果我手动（在HTML标记中）设置alwaysOn，如下所示：
<area shape="poly" coords="447,193,442,225,453,222,467,226,467,235,472,235,475,242,486,242,489,251,448,268,420,276,433,257,434,246,438,235,428,220,433,206,430,194,438,191" href="#" data-county="Northumberland" data-maphilight='{"alwaysOn":true}'>
...确实有效。这是单引号还是双引号的混淆？当我使用jQuery“ attr”语句时，它会自动使用双引号，因此我不得不将它们反向。或者，这是仅设置该属性不会导致jQuery插件更新的问题吗？
当我尝试修改此脚本以执行我想要的操作时，请提供任何建议。
谢谢！
最佳答案
这是单引号还是双引号的混淆？
设置数据属性时。 jQuery尝试将字符串解析为JSON，但前提是该字符串为有效的JSON。因此，data-maphilight='{"alwaysOn":true}'在data-maphilight="{'alwaysOn':true}"时包含有效的JSON。请注意，用于分隔字符串的单引号会产生错误的JSON。
仅设置该属性不会导致jQuery插件更新的问题吗？
嗯，设置数据属性与设置数据对象不同。
// Changes the data-maphilight attribute to the string '{\'alwaysOn\':true}'
$(this).attr('data-maphilight', '{\'alwaysOn\':true}');
// Sets the internal data object to {'alwaysOn': true}. This is a javascript object, not JSON.
$(this).data('maphilight', {'alwaysOn': true});
因此，创建对象后，如果要修改它，则需要使用
.data而不是.attr。更改属性而不导致更新的问题可能是因为我们需要一种方法通知插件发生了更改。我在您引用的示例代码中看到，该插件使用
.trigger('alwaysOn.maphilight')触发此通知。然后，完整的变更声明应如下所示：$(this).data('maphilight', {'alwaysOn': true}).trigger('alwaysOn.maphilight');
请注意，执行此分配会将当前
maphilight数据对象替换为{'alwaysOn': true}替换上一个对象。