2

我需要一些关于我正在创建的 Javascript 函数的帮助。本质上，我需要遍历一组具有类 .DetailRow 的 DIV，并找到一个子 DIV 的内容（内部文本）。如果这个文本与一个变量匹配，那么我需要用一个 IMG HTML 语句替换这个内部文本。

顺便说一句，我对此有点陌生（4个月大！）如果问题很简单，我很抱歉，但我尝试了一些组合并且我被卡住了。

这是HTML：

<div class="DetailRow" style="display: ">..</div>
<div class="DetailRow" style="display: ">..</div>
<div class="DetailRow" style="display: ">
   <div class="Label">Availability:</div>
   <div class="Value">in stock + Free Shipping</div>
</div>

例如，如果我在 LABEL 内部文本中找到“in stock”，我想用变量“instock”的值替换它，它是一个 IMG HTML 语句。请参阅下面的我的代码尝试。

<script type="text/javascript">
$(window).load(function(){
    var instock = '<img src="https://linktoimgfolder/instock.gif" title="Product available, usually ships 24hrs to 48hrs after order receipt" style="margin-top:-3px;">';  
    var lowstock = '<img src="https://linktoimgfolder/lowstock.gif" title="Product stcok low, order today so you do not miss out">';
    var nostock = '<img src="https://linktoimgfolder/outstock.gif" title="Product out of stock, could ship 1 to 2 weeks after order receipt">';

    $('div.DetailRow')each(function(){
        if (indexOf($(this).childNodes[1].innerHTML, "in stock") > 0) {
             $(this).childNodes[2].innerHTML = "";
             $(this).childNodes[2].innerHTML = instock;
        } else if (indexOf($(this).childNodes[1].innerHTML, "low stock") > 0) {
             $(this).childNodes[2].innerHTML = "";
             $(this).childNodes[2].innerHTML = lowstock;
        } else {
             $(this).childNodes[2].innerHTML = "";
             $(this).childNodes[2].innerHTML = nostock;
        };
    });
});
</script>​

顺便说一句，我无法完全匹配文本，因为“+”之外的文本会不时更改，因此我正在尝试 indexOf。

非常感谢您的帮助！

米

4

2 回答 2

2

使用:contains选择器

var stock = {'in stock': instock, 'low stock': lowstock, 'no stock': nostock};

Object.keys(stock).forEach(function(key) {
    $('div.DetailRow div:contains(' + key + ')').html(stock[key]);
});

jsFiddle 演示

一个纯 jQuery 解决方案：

$.each(stock, function(key, value) {
    $('div.DetailRow div:contains(' + key + ')').html(value);
});
于 2013-09-12T04:59:07.627 回答
0

您在此行中有错字，$('div.DetailRow')each(function(){然后您可以使用 jQuery.text()并.html()检查值和更新。

尝试：

$('div.DetailRow').find("div").each(function(){
        if($(this).text().indexOf("in stock")!=-1){
            $(this).text("");
            $(this).html(instock);
        }else if($(this).text().indexOf("low stock")!=-1){
            $(this).text("");
            $(this).html(lowstock);
        }else{
            $(this).text("");
            $(this).html(nostock);
        }
    });

DEMO FIDDLE

注意：更新代码以div在div.DetailsRow. 根据您的要求更改它。

于 2013-09-12T04:50:06.590 回答