Select 具有已知标题属性的元素
Select element with known title attribute
我有一个 select 字段和几个带有图像的 link。单击这些图像会显示另一个 link。完美无缺。
现在我在 Javascript 中有了必须单击的图像的 alt 属性的文本。我如何才能select正确的点击具有相同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"。现在我想 select 带有 title 属性 ImageOne 的 a 元素,这样我就可以触发点击事件。
$(".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");
});
现在最后一行返回值,但我如何比较才能知道单击哪一个?
您可以 select 像这样按属性(和变量)的元素...
var altValue = "alt-tag-value";
var $img = $("img[alt='" + altValue + "']");
这将 return 具有指定 alt 属性值的图像(或图像)。
如果我假设您的 colorText
包含选定的文本值 ImageOne
,您应该能够像这样简单地在锚点上触发一个 click
事件相同的 title
值。
$(".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();
});
我有一个 select 字段和几个带有图像的 link。单击这些图像会显示另一个 link。完美无缺。
现在我在 Javascript 中有了必须单击的图像的 alt 属性的文本。我如何才能select正确的点击具有相同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"。现在我想 select 带有 title 属性 ImageOne 的 a 元素,这样我就可以触发点击事件。
$(".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");
});
现在最后一行返回值,但我如何比较才能知道单击哪一个?
您可以 select 像这样按属性(和变量)的元素...
var altValue = "alt-tag-value";
var $img = $("img[alt='" + altValue + "']");
这将 return 具有指定 alt 属性值的图像(或图像)。
如果我假设您的 colorText
包含选定的文本值 ImageOne
,您应该能够像这样简单地在锚点上触发一个 click
事件相同的 title
值。
$(".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();
});