jquery - 画像を追加してJqueryで入力を送信

Question

こんにちは私は次のコードを持っています

<input type="submit" name="btnCheckOut" value="Buy >>" id="btnCheckOut" />

ソースコードに直接アクセスすることはできませんが、 「購入」テキストの前に「money.png」という画像を追加したいと思います。

Jqueryでこれをどのように行うでしょうか？

Answer 1

「submit」要素に背景画像を追加することで、CSSでそれを行うことができます。

submit {

    background: url('/myimage.png') no-repeat top left;
    padding: 2px 8px;
}

Answer 2

「前」と<input/>は、実際のテキストの前または前（つまり入力内）を意味しますか？

前者の場合、これは次のようになります。

$('input[name=btnCheckOut]').before('<img src="money.png"/>');

後者の場合は、<button>代わりに使用する必要があります。これは、その中のほとんどすべての要素を許可するためです。

$('input[name=btnCheckOut]').before(
    '<button name="btnCheckOut"><img src="money.png"/>Buy &gt;&gt;</button>'
).remove();

Answer 3

Aaron Huran のソリューションですが、JQuery では次のようになります。

$(this).css('background', "url('/myimage.png') no-repeat top left").css('padding', '2px 8px');

Answer 4

before（）を使用して、入力タグの前に画像を挿入します。

http://api.jquery.com/before/

$('#btnCheckOut').before('<img src="money.png" id="..." />');

PS画像もクリック可能にしたい場合は、クリックイベントをバインドしてjQueryを介して画像を管理する必要があります。