在發送操作後（單擊後）更改按鈕的背景顏色

Question

您好我有一個聯繫表單我想用PHP來完成。我有提交按鈕，當所有字段都準備好按下時，我想要發送電子郵件來更改我的按鈕。首先在我的按鈕中是背景顏色爲黃色，文本爲「發送」的文本。當我按下按鈕併發送電子郵件時，我想將背景顏色更改爲紅色，並且我想將圖標添加到文本旁邊，文本將在「已發送」中進行修改。我怎樣才能做到這一點？

Answer 1

<script src="jquery.min.js"></script> 

<script > 
function button(){ 
    //your ajax code for sending data 
    /* function retrieveData(){ 
     $.post('server.php',{}, function(data){ 
    });*/ 

    $("#button").attr('value', 'Sent'); 
    $("#button").css("background-color","red") 
} 
</script> 

<input type="button" id="button" name="button" value="Send" onclick="button()"> 

試試這個。你可以用javascript來做到這一點。

Answer 2

你有一個表單有一些輸入和一個提交按鈕。

您想要在所有表單字段被填充後操作提交按鈕，最後在點擊提交按鈕後再次操作它。

你需要做的就是寫一些JavaScript（無論是普通的香草或jQuery的，選擇什麼最適合你）來處理兩件事情在你的形式

1. 表單的輸入字段（在第一次提交按鈕更改）： 將事件附加到輸入字段以根據需要檢查驗證，並相應地更改提交按鈕。
2. 您的表單提交按鈕（用於第二次提交按鈕更改）： 將點擊事件附加到提交按鈕（並確保防止默認設置，所以一旦點擊提交按鈕，將按照您的方式操作祝願。

我已經寫了一個例子，在那裏我的情況，我有兩個輸入我的表單和一個提交按鈕，這是殘疾人和灰色顯示默認。 只要所有表單域filled-在（不爲空）中，提交按鈕變爲活動狀態（禁用屬性被移除並且顏色改變） - 最後，當點擊提交按鈕時，它會將其顏色更改爲綠色，以表示它已被點擊。

$('#myForm input').on('keyup',function(){ 
    var validated = true; 
    $('#myForm input').each(function(){ 
     if($(this).val() === ''){ 
     validated = false; 
    } 
    }); 
    if(validated){ 
     $('#submitBtn').removeClass('disabled').prop('disabled',false); 
    }else{ 
     $('#submitBtn').addClass('disabled').prop('disabled',true); 
    } 
}); 

$('#submitBtn').on('click',function(e){ 
    e.preventDefault(); 
    e.stopImmediatePropagation(); 
    $(this).addClass('submited').prop('disabled',true); 

    // the rest of your code for submission.. 
}); 

這裏的簡單工作的完整示例： https://jsfiddle.net/wx9gonrh/

當然你也可以用這個例子，並修改自己的需要或使用此爲指導從頭開始編寫自己的。

你的情況，你可能想引入異步方法只改變後的郵件已發送成功提交按鈕（例如一個Ajax完整\完成事件）

希望它能幫助！