在运行Javascript时区分具有相同类或ID的多个div的方法
我正在为发票上的id生成QR代码。
现在，我在要运行qr代码的每个地方都有一个javascript，并生成代码。
<script type="text/javascript">
function makeCode (data,width) {
var qrcode = new QRCode(document.getElementById(data), {
width : width,
height : width
});
var length = (data).length;
if (length===10) {qrcode.makeCode("10" + data);}
else {qrcode.makeCode(data);}
}
</script><div id="[id]"></div><script>makeCode("[id]","50")</script>我之所以必须使用id作为div的"id“，是因为它是我为该项目获得的唯一动态内容。
问题是，当我有多个具有相同id的项目时，javascript当然是将所有QR代码堆积到第一个具有该id的<div>中。
有没有办法让javascript知道它是从第三个DIV运行的(举个例子)，然后将代码放入第三个DIV，而不是第一个DIV。
我知道，您不应该有多个具有相同ID元素的div。这是问题的一部分，我试图使他们独特，但我不知道如何。
我加了一个小提琴，这样你就能更清楚地看到这个问题了。
回答 3
Stack Overflow用户
发布于 2017-02-23 23:42:49
将html更改为：
<div data-content="qr-content" data-value="Your qr content"></div>
<script>
var elements = document.queryselectorall('[data-content="qr-content"]');
for (var i=0; i<elements.length; i++)
makeCode(elements[i].getAttribute('data-value'), 50);
}
</script>Stack Overflow用户
发布于 2017-02-24 01:50:06
正如前面提到的，在您当前的网站逻辑中，很少有东西需要调整以适应更多的动态。
首先，应该有一个表示购物车的table，在这个购物车中，您可以有多个QRcode生成的条目。每个id都可以有一个索引标志1..2.3.
我已经做了一个演示，如何解决您的问题可以通过改变您的html结构。
让我知道你的想法。
Stack Overflow用户
发布于 2017-02-24 03:46:15
我不知道这是怎么回事。
但是，在“产品”的产品中添加一个类并在文档末尾发布以下代码是有效的。
$.each($(".product"), function(index, value){
var num = index + 1;
$(value).attr("id","qrcode"+ num);
});它使每个id在运行后都是唯一的。然而，不知何故，仍然知道要将正确的图像放入哪个div。
https://stackoverflow.com/questions/42428145
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号