更改另一個元素時使用 jQuery 更改元素

Question

我有一個表單，並且想要在填寫所有表單輸入時更改提交按鈕的背景顏色。 我已經開始僅使用 1 個輸入字段對此進行測試，但是當我向輸入添加內容時，按鈕顏色不會實時更改。 如何調整我的代碼，以便我在輸入框中輸入任何內容時，它都會識別它並實時更改按鈕顏色？

jQuery(function($){
   
    var teamname = $('#acff-post-acfef_2207cc4_title').val();
        
    if(teamname !== ''){
        $('.acff-submit-button').css('background-color', 'red');
    }
    
});

Answer 1

您必須在輸入字段上監聽change事件，以便在每次更改時檢查值。 您現在正在做的是在頁面加載時檢查該字段的值。

jQuery(function($){
   
    $('#acff-post-acfef_2207cc4_title').change(() => {
        if ($(this).val() !== '') { // check input value
            $('.acff-submit-button').css('background-color', 'red');
        }
    })
            
});