用图像图标替换编辑和删除html按钮

Question

在下面的jsfiddle中，一切都很完美。我正在尝试用edit.ico和delete.ico替换编辑和删除。这两个图标文件都位于同一目录中。我已经尝试了很多我失去轨道的方法。 jQuery和Javascript相当新，但我拼凑了一个基于这个jsfiddle使用的应用程序。

Please see: http://jsfiddle.net/asifrc/EfRWZ/2/

我很感激任何人都可以给予帮助。

Answer 1

有多种方法可以用图标替换按钮。这是JSFiddle的一个分支，带有编辑和删除图标。

http://jsfiddle.net/colinwhitmarsh/2nt3vc2r/1/

在HTML的顶部，您可以看到<link/>标记，用于加载Google的素材图标https://design.google.com/icons/。这些都是免费且易于使用的。如果您不熟悉图标并希望进行实验，我会推荐它们。

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" 
rel="stylesheet">

要包含图标，我将<button>标记更改为<i>，添加了class="material-icons"，并将文本更改为图标的名称。检查design.google.com/icons以查找您要使用的其他图标的名称。

<强>更改

<button onclick='deleteRow(" + rowID + ")'>Delete</button>

要

<i class='material-icons' onclick='deleteRow(" + rowID + ")'>delete</i>

希望这有帮助！