javascript - 使用 jquery，如何使用 img src="javascript :? 用匹配的图片填充我的表行

Question

假设我有一个表格，如下所示，我正在尝试为每一行填充许多 jpeg，例如 BillSmith.jpg和NancyClinton.jpg .

用图片填充的示例表:

纽约 |史密斯，比尔 (试图将 'BillSmith.jpg' 放在这里)
纽约 |克林顿，南希 (试图将 'NancyClinton.jpg' 放在这里)

我很困惑在这部分之后要放什么<img src="javascript:在下面的代码片段的第二行到最后一行中。

$("#html_table tbody td:nth-child(2)").each(function(){
        var the_name = $(this).html();

        // Creates the string of file names ( BillSmith.jpg ) matching the file names of jpeg pics

        var nameList = the_name.split(",");
        var firstLast = nameList[1] + nameList[0];
        var source_foto = "staff_jpegs/"+firstLast+".jpg";

        $(this).html( the_name +'<br><div class="fotos" style="text-align:center"><img src="javascript:source_foto" height="80" width="80"/></div>');
        });

上面的代码不起作用，因为我假设函数而不是变量只能在 javascript: 之后.

寻找一种简单的方法，或多或少使用这种结构将许多照片放入相应的表行中。

Answer 1

$("#html_table tbody td:nth-child(2)").each(function(){
        var the_name = $(this).html();

        // Creates the string of file names ( BillSmith.jpg ) matching the file names of jpeg pics

        var nameList = the_name.split(", ");
        var firstLast = nameList[1] + nameList[0];
        var source_foto = "staff_jpegs/"+firstLast+".jpg";

        $(this).html( the_name +'<br><div class="fotos" style="text-align:center"><img src="'+source_foto+'" height="80" width="80"/></div>');
        });

您不需要 JavaScript:您可以只使用变量名称。另外，你的分割应该在“，”上，而不仅仅是“，”