Javascript 用CSS生成的图像替换输入字段中的文本

我有一些输入字段，其值为

开

或

关

，我想用

CSS生成的图像替换这些字段。

这可能吗？我问了一个问题，但是关于表格中的单元格。我可以用CSS生成的图像替换单元格值。但是我一直在摆弄

INPUT Type=text

字段，想不出一种方法来替换

INPUT

类型字段。我在这里看到一些人使用了存储在url中的图片。但是如果使用CSS生成的图像而不是链接到图片，那就太好了

代码（html、css、js）

现金
互联网

---

sOn='On'
$（'span:contains（“On”））.html（sOn）；

---

最后一行代码用于替换表中的单元格值。我不知道如何对输入字段值执行相同的操作。

要替换输入字段，只需执行以下操作：

$("input[type='text'][value='On']").replaceWith(sOn);

您的更新为上述行

sOn = '<div class="button-wrap"> <div class="button-out">On</div> <div class="button-switch"></div> </div>'

$('span:contains("On")').html(sOn);

$("input[type='text'][value='On']").replaceWith(sOn);