jquery - 如何将完整的 HTML 从输入更改为图像并维护 onClick 事件

Question

我需要从这里更改此 HTML：

<input type="button" class="rsform-button" id="compra_exc" name="form[compra_exc]" value="Buy">

对此：

<img src="button_ok" class="rsform-button" id="compra_exc" name="form[compra_exc]" />

但是我需要保持按钮行为，这意味着当我单击应该发送表单的按钮时，可能会获取表单名称并编写以下内容：

$("#compra_exc").click(function(){
 $("#form_id").submit();
});

这份工作是否不太确定（希望你能告诉我我是否正确），但我不知道如何更改 HTML 代码，有什么帮助吗？

Answer 1

为什么要从input改成img？你不能给你的输入一个背景图像吗？您可能需要调整宽度和高度以适合您的图像，但您可以使其看起来完全相同，而无需操作 dom。

.rsform-button {
    background-image: url('button_ok.png');
}

Answer 2

为了能够点击一个新元素，你不能直接调用该元素，所以你可以调用表单并找到它下面的 id：

var content='<img src="button_ok" class="rsform-button" id="compra_exc" name="form[compra_exc]" />'
$('#compra_exc').after(content);
$('input[id=compra_exc]').remove();
$("#form_id").find('#compra_exc').click(function () {
   $("#form_id").submit();
});

演示在这里