window.onload запускает только одну функцию, когда я устанавливаю две разные функции

Question

У меня проблема с этими двумя сценариями, которые я кодировал, похоже, что какой-либо сценарий находится на нижних функциях, поэтому, если я переключу их на один из нижних, сработает: S, пожалуйста, код помощи ниже

<script type="text/javascript">
window.onload = function() {
//Badge
var eSelect = document.getElementById('leftbadge');
        var yellowplate = document.getElementById('numberplateyellow');
        var whiteplate = document.getElementById('numberplatewhite');
        eSelect.onchange = function() {
            if(eSelect.selectedIndex === 0) {
                yellowplate.style.backgroundImage = 'url("builder/yellow_bg.png")';
                whiteplate.style.backgroundImage = 'url("builder/white_bg.png")';
                yellowplate.style.textAlign = 'center';
                yellowplate.style.paddingRight = '0';
                whiteplate.style.textAlign = 'center';
                whiteplate.style.paddingRight = '0';
            }else if(eSelect.selectedIndex === 1) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_ENG.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_ENG.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }else if(eSelect.selectedIndex === 2) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_GB.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_GB.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }else if(eSelect.selectedIndex === 3) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_GB2.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_GB2.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }else if(eSelect.selectedIndex === 4) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_SCO.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_SCO.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }else if(eSelect.selectedIndex === 5) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_CYMRU.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_CYMRU.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }
        }
}
</script>
<script type="text/javascript">
//Font
        window.onload = function() {
        var eSelect = document.getElementById('font');
        var yellowplate = document.getElementById('numberplateyellow');
        var whiteplate = document.getElementById('numberplatewhite');
        eSelect.onchange = function() {
            if(eSelect.selectedIndex === 0) {
                yellowplate.style.fontFamily = 'JepsonCarRegular';
                whiteplate.style.fontFamily = 'JepsonCarRegular';
            } else {
                yellowplate.style.fontFamily = 'twotoneRegular';
                whiteplate.style.fontFamily = 'twotoneRegular';
            }
        }
    }
</script>

Так что в этом примере шрифт изменится, но значки не будут, если я попытаюсь там выпасть

Answer 1

Вы назначаете 2 действия для window.onload. Нижний всегда будет выполняться, потому что он назначен последнему (и, следовательно, он переопределил предыдущее назначение функции).

Вы должны посмотреть на объединение двух действий onload в 1, примерно так:

<script type="text/javascript">
function handleBadges()
{
    //Badge
    var eSelect = document.getElementById('leftbadge');
    var yellowplate = document.getElementById('numberplateyellow');
    var whiteplate = document.getElementById('numberplatewhite');
    eSelect.onchange = function() 
    {
        if(eSelect.selectedIndex === 0) {
            yellowplate.style.backgroundImage = 'url("builder/yellow_bg.png")';
            whiteplate.style.backgroundImage = 'url("builder/white_bg.png")';
            yellowplate.style.textAlign = 'center';
            yellowplate.style.paddingRight = '0';
            whiteplate.style.textAlign = 'center';
            whiteplate.style.paddingRight = '0';
        }else if(eSelect.selectedIndex === 1) {
            yellowplate.style.backgroundImage = 'url(builder/yellow_bg_ENG.png)';
            whiteplate.style.backgroundImage = 'url(builder/white_bg_ENG.png)';
            //Align To Right and then add padding
            yellowplate.style.textAlign = 'right';
            yellowplate.style.paddingRight = '10px';
            whiteplate.style.textAlign = 'right';
            whiteplate.style.paddingRight = '10px';
        }else if(eSelect.selectedIndex === 2) {
            yellowplate.style.backgroundImage = 'url(builder/yellow_bg_GB.png)';
            whiteplate.style.backgroundImage = 'url(builder/white_bg_GB.png)';
            //Align To Right and then add padding
            yellowplate.style.textAlign = 'right';
            yellowplate.style.paddingRight = '10px';
            whiteplate.style.textAlign = 'right';
            whiteplate.style.paddingRight = '10px';
        }else if(eSelect.selectedIndex === 3) {
            yellowplate.style.backgroundImage = 'url(builder/yellow_bg_GB2.png)';
            whiteplate.style.backgroundImage = 'url(builder/white_bg_GB2.png)';
            //Align To Right and then add padding
            yellowplate.style.textAlign = 'right';
            yellowplate.style.paddingRight = '10px';
            whiteplate.style.textAlign = 'right';
            whiteplate.style.paddingRight = '10px';
        }else if(eSelect.selectedIndex === 4) {
            yellowplate.style.backgroundImage = 'url(builder/yellow_bg_SCO.png)';
            whiteplate.style.backgroundImage = 'url(builder/white_bg_SCO.png)';
            //Align To Right and then add padding
            yellowplate.style.textAlign = 'right';
            yellowplate.style.paddingRight = '10px';
            whiteplate.style.textAlign = 'right';
            whiteplate.style.paddingRight = '10px';
        }else if(eSelect.selectedIndex === 5) {
            yellowplate.style.backgroundImage = 'url(builder/yellow_bg_CYMRU.png)';
            whiteplate.style.backgroundImage = 'url(builder/white_bg_CYMRU.png)';
            //Align To Right and then add padding
            yellowplate.style.textAlign = 'right';
            yellowplate.style.paddingRight = '10px';
            whiteplate.style.textAlign = 'right';
            whiteplate.style.paddingRight = '10px';
        }
    }
}    
function handleFonts()
{
    var eSelect = document.getElementById('font');
    var yellowplate = document.getElementById('numberplateyellow');
    var whiteplate = document.getElementById('numberplatewhite');
    eSelect.onchange = function() {
        if(eSelect.selectedIndex === 0) {
            yellowplate.style.fontFamily = 'JepsonCarRegular';
            whiteplate.style.fontFamily = 'JepsonCarRegular';
        } else {
            yellowplate.style.fontFamily = 'twotoneRegular';
            whiteplate.style.fontFamily = 'twotoneRegular';
        }
    }
}
window.onload = function() 
{
    handleBadges()
    handleFonts()
}
</script>

Answer 2

Я думаю, вам нужно использовать addEventListener.Если я не ошибаюсь, когда вы устанавливаете window.onload, вы заменяете все, что там было, вместо добавления другого прослушивателя для события onload.

проверьте эту ссылку.https://developer.mozilla.org/en/DOM/element.addEventListener

<script type="text/javascript">
window.addEventListener("load", function() {
//Badge
var eSelect = document.getElementById('leftbadge');
        var yellowplate = document.getElementById('numberplateyellow');
        var whiteplate = document.getElementById('numberplatewhite');
        eSelect.onchange = function() {
            if(eSelect.selectedIndex === 0) {
                yellowplate.style.backgroundImage = 'url("builder/yellow_bg.png")';
                whiteplate.style.backgroundImage = 'url("builder/white_bg.png")';
                yellowplate.style.textAlign = 'center';
                yellowplate.style.paddingRight = '0';
                whiteplate.style.textAlign = 'center';
                whiteplate.style.paddingRight = '0';
            }else if(eSelect.selectedIndex === 1) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_ENG.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_ENG.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }else if(eSelect.selectedIndex === 2) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_GB.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_GB.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }else if(eSelect.selectedIndex === 3) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_GB2.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_GB2.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }else if(eSelect.selectedIndex === 4) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_SCO.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_SCO.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }else if(eSelect.selectedIndex === 5) {
                yellowplate.style.backgroundImage = 'url(builder/yellow_bg_CYMRU.png)';
                whiteplate.style.backgroundImage = 'url(builder/white_bg_CYMRU.png)';
                //Align To Right and then add padding
                yellowplate.style.textAlign = 'right';
                yellowplate.style.paddingRight = '10px';
                whiteplate.style.textAlign = 'right';
                whiteplate.style.paddingRight = '10px';
            }
        }
});
</script>
<script type="text/javascript">
//Font
    window.addEventListener("load",function() {
        var eSelect = document.getElementById('font');
        var yellowplate = document.getElementById('numberplateyellow');
        var whiteplate = document.getElementById('numberplatewhite');
        eSelect.onchange = function() {
            if(eSelect.selectedIndex === 0) {
                yellowplate.style.fontFamily = 'JepsonCarRegular';
                whiteplate.style.fontFamily = 'JepsonCarRegular';
            } else {
                yellowplate.style.fontFamily = 'twotoneRegular';
                whiteplate.style.fontFamily = 'twotoneRegular';
            }
        }
    });
</script>