Question

我使用两个表，一个用于产品名称，一个用于产品图像路径... 我能够抓取图像路径并动态地将图像添加到html。它工作正常。

问题在于，当我想在悬停时添加图像标题，这是顶级的div类图像，我使用jQuery的每个函数更改悬停div上的标题，标题被连接而不是添加到特定的图像。

这是我从表路径附加图像的代码..

<script type="text/javascript">
    $(document).ready(function () {
        $('#mainContentPlaceholder_productPathGridView').hide(); //Hides ImagePath Gridview

        var arr = []; //Creates an Array Path Arr
        $("#mainContentPlaceholder_productPathGridView td").each(function () {  //Loops through GridView Td (Table Columns)
            arr.push($(this).text());
        });

        // Starts adding Images to the  Gallery 
        $.each(arr, function (index, imageLocation) {
            $(".megafolio-container").append('<div class="mega-entry jeans cat-all" data-src="' + imageLocation + '"' + 'data-width="395" data-height="507"><div class="mega-hover"><div class="mega-hovertitle"><h2 class="productNameTitle"></h2><a class="shopButton" href="itemDetails.aspx">Details</a></div></div></div>'); //Apended New  Values
        });

    });
</script>

这是我追加ID的附加代码：

<!-- Getting Product Names-->

<script type="text/javascript">
    $(document).ready(function () {
        $('#mainContentPlaceholder_productNameGridView').hide(); //Hides ImagePath Gridview

        var arr2 = []; //Creates an Array Path Arr
        $("#mainContentPlaceholder_productNameGridView td").each(function () {  //Loops through GridView Td (Table Columns)
            arr2.push($(this).text());
        });

        // Starts adding Images to the  Gallery 
        $.each(arr2, function (index, productname) {
         //   alert(productname);
           $(".productNameTitle").text(productname); //Apended New Name
        });
        });
</script>

现在存在问题，因为每个div都会连接id ..

Answer 1

如果我没有错..为什么你不使用一个循环而不是两个...你正在创建teo不同的数组arr，arr2并循环它...以显示相同的文本..

试试这个

$("#mainContentPlaceholder_productNameGridView td").each(function () {  //Loops through GridView Td (Table Columns)
        $(".megafolio-container").append('<div class="mega-entry jeans cat-all" data-src="' + $(this).text() + '"' + 'data-width="395" data-height="507"><div class="mega-hover"><div class="mega-hovertitle"><h2 class="productNameTitle"></h2><a class="shopButton" href="itemDetails.aspx">Details</a></div></div></div>'); //Apended New  Values
        $(".productNameTitle").text($(this).text());
    });

从不同的表中获取值并附加到jquery

1 个答案: