Textbox Class Onchange Event Listener Not Working with Multiple Classes

问题

<input class="item-quantities valid" data-bomid="1939" data-rid="2054" id="AddedItemIDs_1939_" name="AddedItemIDs[1939]" onkeypress="return isNumberKey(event)" type="text" value="7" aria-invalid="false">

Can't get this to work. What I've tried...

$('.item-quantities, .valid').change(function () {
            alert("we are here");
});

or...

$('.item-quantities.valid').change(function () {
            alert("we are here");
});

or...

$('.item-quantities').change(function () {
            alert("we are here");
});

... and a few other variations.

Can't seem to figure out how to trigger this event. I've been playing around with various variations of $('.item-quantities, .valid'), to no avail. What is the correct way to do this?

回答1:

<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
        <script>
        $( document ).ready(function() {
            $(".item-quantities").change(function () {
                        alert("we are here");
            });
        });

        </script>
    </head>
    <body>

        <input id="items" class="item-quantities valid" type="text">
    </body>
<html>

That will do the trick for classes

回答2:

Try this:

$('.item-quantities.valid').change(function () {
    alert("we are here");
});

But change event of text only fires on its focus lost, its better to use keypress or keydown

Working fiddle

回答3:

You can use oninput and onkeypress event like this: Working fiddle

    $('.item-quantities, .valid').on('input',function(e){
         alert("we are here")
        });

$('.item-quantities, .valid').on('change keypress', function(e){
         alert("we are xfgdfgdgdfg")
        });

Or like this

<input class="item-quantities valid" type="text" onchange="yourFunction();"
onkeyup="this.onchange();" onpaste="this.onchange(); onkeypress=this.onchange()" oninput="this.onchange();"/>

来源：https://stackoverflow.com/questions/40733589/textbox-class-onchange-event-listener-not-working-with-multiple-classes

标签

javascript

jquery

textbox

onchange