將loading.gif圖片添加到.val（）

Question

如何在腳本中向.val（）添加loading.gif圖像？

我努力了：

this.submitButton.val('<input type="image" src="http://localhost:8000/loader.gif">').prop('disabled', true);

但這不起作用！ 有什么建議么 ？

Answer 1

   init: function() {
       this.form = $('#billing-form');
       this.submitButton = this.form.find('input[type=submit]');
       this.submitButtonValue = this.submitButton.val();

       var stripeKey = $('meta[name="publishable-key"]').attr('content');
       Stripe.setPublishableKey(stripeKey);

       this.bindEvents();
    },

    bindEvents: function() {
        this.form.on('submit', $.proxy(this.sendToken, this));
    },

    sendToken: function(event) {
        this.submitButton.val('<input type="image" src="http://localhost:8000/loader.gif">').prop('disabled', true);

        Stripe.createToken(this.form, $.proxy(this.stripeResponseHandler, this));

        event.preventDefault();
    },

HTML只是像這樣的標准按鈕：

     <input type="submit" value="Subscribe"> 

Answer 2

這可能是您的問題的解決方案：

<button type="submit">Button</button>

$(document).ready(function(){
    $('button').on('click', function(){
       $(this).append('<img src="" width="10" height="10" />'); 
    });
});

請注意，我在示例中使用了按鈕，而不是輸入，因為輸入不允許在其中應用任何內容

如果您想堅持輸入標記，請考慮在加載時將其添加到某個類，例如。

.loading {
    background: url(...)
}

這是第一個示例的jsfiddle： http : //jsfiddle.net/Xu84a/