How to use multiplate onkeyup input?

I have this input, I want use 2 onkeyup in one input, How use it?

My input:

<input type="text" onkeyup="onInputChange(this)" onkeyup="separateNum(this.value,this);">

My First onkeyup scrept:

<script>
        function separateNum(value, input) {
                /* seprate number input 3 number */
                var nStr = value + '';
                nStr = nStr.replace(/\,/g, "");
                x = nStr.split('.');
                x1 = x[0];
                x2 = x.length > 1 ? '.' + x[1] : '';
                var rgx = /(\d+)(\d{3})/;
                while (rgx.test(x1)) {
                    x1 = x1.replace(rgx, '$1' + ',' + '$2');
                }
                if (input !== undefined) {

                    input.value = x1 + x2;
                } else {
                    return x1 + x2;
                }
            }
</script>

My secend onkeyup scrept:

<script>
function onInputChange(e) {
  const span = document.getElementById('result');
  span.innerHTML = Math.floor(e.value / 10);
}
</script>

11 thoughts on “How to use multiplate onkeyup input?”

  1. function test1(x){
    console.log(x)
    }
    
    function test2(x,y){
    console.log(x,y)
    }
    <input type="text" onkeyup="test1(this); test2(this.value,this);">

    change this:

    <input type="text" onkeyup="onInputChange(this)" onkeyup="separateNum(this.value,this);">
    

    to:

    <input type="text" onkeyup="onInputChange(this); separateNum(this.value,this);">
    
    Reply
  2. You should not be using inline HTML event attributes in today’s world. Inline event attributes like onXyz where how we "wired" up event handling functions to events before we had standards. Using this technique today "works", but introduces shortcomings and, in some case, bigger problems.

    Instead, follow modern standards and use .addEventListener() separately in JavaScript, which provides a more robust mechanism for event handling registrations (and de-registrations). In your case, you would just register two handlers for the same event and they will be invoked in the order that you registered them:

    // Get a reference to the HTML element
    const input = document.querySelector("input");
    
    // Register event handlers
    input.addEventListener("keyup", foo1);
    input.addEventListener("keyup", foo2);
    
    function foo1(event){
      console.log("foo1 detected key up after " + event.key + " was pressed.");
    }
    
    function foo2(event){
      console.log("foo2 detected key up after " + event.key + " was pressed.");
    }
    <input type="text">
    Reply

Leave a Comment