So, for applying alphanumeric only validation in js we will use onkeypress event of input boxes. So you can check the below code for applying the validation.

Below is a code in HTML and JavaScript to alphanumeric validate a text field

<form>
    <div class="form-group row">
        <label for="inputPassword" class="col-sm-2 col-form-label">Enter Only Alphanumeric</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="inputAlphanumeric" placeholder="Enter Only Alphanumeric" value="" name="inputAlphanumeric" onkeypress="return onlyAlphanumerics(event)" />
        </div>
    </div>
</form>

Here is how to validate the input only to accept alphanumeric this will only take alphanumeric values like "abcc1234". We are using event keycodes for validating alphanumeric data in the textboxes.

<script>
     function onlyAlphanumerics(e) {
        var regex = new RegExp("^[a-zA-Z0-9]+$");
        var str = String.fromCharCode(!e.charCode ? e.which : e.charCode);
        if (regex.test(str)) {
            return true;
        }
        e.preventDefault();
        return false;
    } 
</script>

You can get Complete code of HTML form and alphanumeric function

<form>
    <div class="form-group row">
        <label for="inputPassword" class="col-sm-2 col-form-label">Enter Only Alphanumeric</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="inputAlphanumeric" placeholder="Enter Only Alphanumeric" value="" name="inputAlphanumeric" onkeypress="return onlyAlphanumerics(event)" />
        </div>
    </div>
</form>
<script>
     function onlyAlphanumerics(e) {
        var regex = new RegExp("^[a-zA-Z0-9]+$");
        var str = String.fromCharCode(!e.charCode ? e.which : e.charCode);
        if (regex.test(str)) {
            return true;
        }
        e.preventDefault();
        return false;
    } 
</script>

So, this is how you can implement alphanumeric validation in JavaScript