How can I prevent 2 spaces in a row being entered in text input and textarea?

Question

I want to prevent 2 spaces from being entered consecutively. Right now, for a name, you can use all spaces. I want multiple words with 1 space in-between each word, but not more than 1 space together. Also, possibly even prevent multiple spaces if the text was copied and pasted in?

I force 3 characters but they can all be spaces in my form unless I use this code but it stops all spaces. I want to allow only 1 space between words. :

<input type="text" name="name" placeholder="Required...." 
  minlength="3" maxlength="40" required 
  oninvalid="this.setCustomValidity('Please enter a name with at least 3 characters.')" 
  oninput="setCustomValidity('')" 
  onKeyDown="javascript: var keycode = keyPressed(event); if(keycode==32){ return false; }" 
/>

I found a way to stop all spaces but I lost the code trying other things. I could find it again but it is not exactly what I want. I know there must be a simple way, and I can't be the only one who wants it. Can someone please help me?

Answer 1

As you can see from my example the code i linked work with oninput too

document.querySelector('input').addEventListener('input', (e) => {
   e.target.value = e.target.value.replace( /  +/g, ' ' );
});
document.querySelector('input').addEventListener('change', (e) => {
   e.target.value = e.target.value.replace( /  +/g, ' ' );
});

<input type="text">