Question

我有一个选择字段和几个带图像的链接。单击这些图像将显示另一个链接。这完美无瑕。

现在我在Javascript中有必须单击的图像的alt属性的文本。如何选择正确的单击具有相同alt属性的那个：

这是我的HTML：

<div class="additionalimages">
    <div class="additional-images">
        <div class="row">
            <div class="col">
                <img src="image1.jpg" class="product-image" style="cursor: pointer" data-descr="">
                <a href="image1.jpg" class="product-image image-0" style="display:none;" title="ImageOne"></a>      
            </div>
            <div class="col">
                <img src="image2.jpg" class="product-image" style="cursor: pointer" data-descr="">
                <a href="image1.jpg" class="product-image image-1" style="display:none;" title="ImageTwo"></a>  
            </div>

        </div>
    </div>
</div>

这是我的Javascript来获取select的值。现在我得到了文字“ImageOne”。现在我想选择一个标题属性为ImageOne的元素，这样我就可以触发一个click事件。

$(".vm-chzn-select").chosen().change(function (event) {
  console.log("Select changed");
  var colorText = $(".vm-chzn-select option:selected").text();

  $(".additionalimages").find("a.product-image").attr("title"); 



});

现在最后一行给了我这个值，但我怎么比较，所以我知道要点击哪一个？

Answer 1

如果我假设您的colorText包含所选的文字值ImageOne，那么您应该能够像这样做，在锚点上使用相同的click事件触发title事件{1}}值。

$(".vm-chzn-select").chosen().change(function (event) {
  console.log("Select changed");
  var colorText = $(".vm-chzn-select option:selected").text();

  $(".additionalimages a.product-image[title='" + colorText + "']").click(); 

});

Answer 2

您可以按属性（和变量）选择元素......

var altValue = "alt-tag-value";
var $img = $("img[alt='" + altValue + "']");

这将返回具有指定alt属性值的图像（或图像）。

选择具有已知标题属性的元素

2 个答案: