Сфокусируйтесь на поле ввода номера, а затем имитируйте нажатие клавиши со стрелкой

Question

У меня есть кнопка, которая при нажатии должна фокусироваться на поле ввода рядом с ней, а затем имитировать нажатие клавиши «Стрелка вверх». Это должно увеличить значение внутри поля ввода. Я написал следующий код, но он не работает:

$('.add').click(function () {

        var selectedInput = $(this).prev('input');

            if (selectedInput.val() < 10) {
                    selectedInput.focus();
                    selectedInput.trigger(jQuery.Event('keypress', { keycode: 38 }));
            }

    });

Answer 1

Вы должны использовать HTML функции элементов, https://www.w3schools.com/jsref/met_number_stepup.asp

$(document).on('click','.add', function () {

        var selectedInput = $('.product-quantity input');

            if (selectedInput.val() < 10) {
                    selectedInput.focus();
                    selectedInput[0].stepUp(1);
            }

    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   <div class="product-quantity"> <input type="number"  value="0"/>
<span class="add">Add</span>
</div>

Answer 2

Вы можете сделать это следующим образом. В вашем .cs html

 <input type=button id=abc value="abc">
 <input type="text" id="txtABC" value=1>

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

$("#abc").on('click',function(){
$("#txtABC").focus();
$("#txtABC").val(+$("#txtABC").val()+1);
//alert('hi')
})

Я добавил маленький образец здесь. Отнесите это для

https://jsbin.com/cotinexore/edit?html, js, выход