Javascript 按生成的id显示隐藏图像

我有一段代码，它用javascript生成一个组ID。它显示在这里：。 现在，我希望它控制显示的图像，而不是编写文本“groupid:X”。共有7个组id和7个图像

    <div data-role="content" id="pictures"> 
        <img src="images/image1.jpg" alt="image" id="pict1">
        <img src="images/image2.jpg" alt="image" id="pict2">    
        <img src="images/image3.jpg" alt="image" id="pict3">    
        <img src="images/image4.jpg" alt="image" id="pict4">    
        <img src="images/image5.jpg" alt="image" id="pict5">    
        <img src="images/image6.jpg" alt="image" id="pict6">    
        <img src="images/image7.jpg" alt="image" id="pict7">    
    </div>

但这将导致大量的重新输入，我真的不知道如何让它工作。 那么，有人知道我如何在单击按钮时获取生成的组ID以显示正确的图像吗？

您可以隐藏所有内容（使用一些常规选择器），然后只显示您需要的一个。例如

function show_img(id) {
    // hide every image that is immediate child of node with "pictures" id
    $('#pictures > img').hide();
    $('#pict'+id).show();
}

您可以隐藏所有内容（使用一些常规选择器），然后只显示所需的内容。例如

function show_img(id) {
    // hide every image that is immediate child of node with "pictures" id
    $('#pictures > img').hide();
    $('#pict'+id).show();
}

---

像这样的东西可能有用-

function show_img(id)
{
  // hide all other images (possibly only within a certain parent element)
  $("#parent_selector > img").hide();

  // display only specified image by id
  $("#img"+id).show();
  return false;
}

---

像这样的东西可能有用-

function show_img(id)
{
  // hide all other images (possibly only within a certain parent element)
  $("#parent_selector > img").hide();

  // display only specified image by id
  $("#img"+id).show();
  return false;
}

---

以下代码将隐藏id以

img

开头的所有图像，然后显示传入id的图像：

function show_img(id)
{
    $('img[id^="img"]').hide();
    $('#img' + id).show();
} 

---

以下代码将隐藏id以img开头的所有图像，然后显示id已传入的图像：

function show_img(id)
{
    $('img[id^="img"]').hide();
    $('#img' + id).show();
} 

我建议（尽管未经测试）：

我建议（尽管未经测试）：

---

在您的标记中有一个额外的

img

：imgid=“img1”>谢谢。更正了。另外，为了避免混淆，我将图像id从“imgX”更改为“pictX”。在您的标记中有一个额外的

img

：imgid=“img1”>谢谢。更正了。此外，我还将图像id从“imgX”更改为“pictX”，以避免混淆。如何将生成的id保存为函数id？如何将生成的id保存为函数id？您还知道如何将通过复选框（在JSFIDLE中）生成的id保存为此函数中使用的id吗？（另外，我将我的原始图像ID编辑为“pictX”，以避免被“img”标记混淆。您能更新您的建议吗？）您所说的“保存为ID”是什么意思？在JSFIDLE中，当您选中一些复选框时，它会显示“组ID:X”。但我不希望它显示组id，我希望它保存该组id并将其用作影响此功能的id。因此，选中复选框1时，它会显示图像1（#pict1）。当复选框1和2被选中时，它会显示图像3（#pict3）等等。等等，那么显示图片的规则是什么？如果勾选复选框1和2，我们显示的是pict3，那么勾选复选框1和3时会发生什么情况？图片4？要显示的图像的id是复选框值的总和吗？只需获取计算出的id并将其传递给上面的函数，您还知道我如何获取通过复选框（在JSFIDLE中）生成的id，并将其保存为此函数中使用的id吗？（另外，我将我的原始图像ID编辑为“pictX”，以避免被“img”标记混淆。您能更新您的建议吗？）您所说的“保存为ID”是什么意思？在JSFIDLE中，当您选中一些复选框时，它会显示“组ID:X”。但我不希望它显示组id，我希望它保存该组id并将其用作影响此功能的id。因此，选中复选框1时，它会显示图像1（#pict1）。当复选框1和2被选中时，它会显示图像3（#pict3）等等。等等，那么显示图片的规则是什么？如果勾选复选框1和2，我们显示的是pict3，那么勾选复选框1和3时会发生什么情况？图片4？要显示的图像id是复选框值的总和吗？只需获取计算出的id并将其传递给上面的函数即可