Leaflet 如何获取BindPopup上的内容

我正在尝试在单击事件时获取marker的.bindPopup内容，以便将其保存到localStorage。但对于每个标记，它都不能正常工作

 L.marker([76.920614, -60.117188])
 .addTo(map)
 .bindPopup('<div><span class="claimed">DATA 1</span></div>')
 .on('click', groupClick);

 L.marker([77.841848, -31.289063])
 .addTo(map)
 .bindPopup('<div><span class="claimed">DATA 2/span></div>')
 .on('click', groupClick)

 function groupClick(event) {
   var a = document.querySelector('.claimed').innerHTML;
   console.log(a);
 }

L.marker（[76.920614，-60.117188]）
.addTo（地图）
.bindPopup（“数据1”）
.on（'click'，groupClick）；
L.标记（[77.841848，-31.289063]）
.addTo（地图）
.bindPopup（“数据2/span>”）
.on（'click'，groupClick）
函数组单击（事件）{
var a=document.querySelector（'.claired'）.innerHTML；
控制台日志（a）；
}

它在第一次单击时工作，但在第二次单击不同的标记时，它将从我单击的第一个标记而不是第二个标记获取数据。在这种情况下，我必须先单击地图上的其他地方或单击弹出关闭按钮，然后才能单击下一个标记以正确获取数据。是否对此进行了修复？

问题： 您在函数中只选择了类的第一次出现（而不是单击的子项）

解决方案1（不推荐）： 您应该使用this关键字，以及getPopup（）和getContent（）方法，您的函数应该类似于：

function groupClick(event) {
   var a = this.getPopup().getContent();
   console.log(a);
}

这样您将获得转义的html，因此更好、更合适的方法是

解决方案2（推荐）：如果在标记选项中存储必要的数据（而不是从弹出窗口存储和获取html），如下所示：

 L.marker([40, 12], {data: 1, datastring: 'first'})
   .addTo(map)
   .bindPopup('ONE')
   .on('click', groupClick);

然后，您可以通过以下方式在函数中访问此选项：

function groupClick(event) {
   var a = this.options.data + ' ' + this.options.datastring;
   alert(a);
 }

A又来了

编辑：我找到了所需逻辑的解决方法。但仍然需要链接标记及其弹出内容，因为： 弹出内容不是DOM中的节点，因此在用户单击打开它之前，您无法访问它。

因此，在我的解决方案中，我在标记选项（divId:int）中存储了一个简单的整数，它是标记的唯一id。在弹出内容中，无线电输入具有与所需字符串（）连接的相同id

---

.

好的，我一直在研究您给出的第一个解决方案，还有很多东西要用javascript学习。现在我了解了queryselection。但是如果我想在弹出窗口中获取html id、名称和值，该怎么办。。像这样的。在单选按钮上，我想保存用户选择的id检查编辑，我认为其余部分（localStorage store和retrieve on reload）可以实现，对吗？是的，关于这一点，你能给出一些localStorage的基本代码，说明如何保存用户选择的内容，并在页面刷新时加载它吗？对于存储和检索localstorage，我可能有一些想法，但当.bindPopup单击edUse

localstorage.setItem（a.id，a.value）时，我并不真正想在html代码上实现它

设置项目，以及

localStorage.getItem（a.id）以检索它。检查MDN文档。
function groupClick(event) {
   var a = this.options.data + ' ' + this.options.datastring;
   alert(a);
 }

L.marker([40, 32], {
     divId: 10
   })
   .addTo(map)
   .bindPopup('<div id="2div" class="popup-todo"><input type="radio" id="Item-10-0" name="Item-10" value="0" checked=""><label for="Item-10-0">Claimed</label><input type="radio" id="Item-10-1" name="Item-10" value="1"><label for="Item-10-1">Unclaimed</label></div>')
   .on('click', groupClick);

function groupClick(event) {
    var a = document.querySelector('input[name=Item-'+this.options.divId+']');
    document.querySelector('#demo').innerHTML = a.id + ' ' + a.value;
 }