Как вызвать событие ввода поиска с помощью нажатия кнопки

Question

Я хочу активировать событие ввода on.input, если значение изменено не путем ввода Введите что-нибудь в поле ввода и нажмите кнопку

$('.inpsearch').on('input', function(){
    let a = $(this).val();
  console.log(a);
});

$('button').on('click', function(){
    $('.inpsearch').val('');
  // console.log expected here
 });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='search' class='inpsearch'>
<button>CLICK</button>

Answer 1

Вы можете либо trigger событие input, как в моем фрагменте, либо разделить эту функциональность на функцию и вызвать ее.

$('.inpsearch').on('input', function(){
    let a = $(this).val();
  console.log(a);
});

$('button').on('click', function(){
    $('.inpsearch').val('');
    $('.inpsearch').trigger('input');
  // console.log expected here
 });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='search' class='inpsearch'>
<button>CLICK</button>

Answer 2

К сожалению, событие ввода относительно новое и доступно только для современных браузеров (IE9 +), проверьте совместимость

Вот действительно хорошо описанный ответ о событиях.

Мое предложение - использовать событие keyup вместо события input. Как и при нажатии клавиши, оно срабатывает всякий раз, когда пользователь отпускает клавишу, я также реализовал в вашем примере:

$('.inpsearch').on('keyup', function(){
    let a = $(this).val();
    console.log(a);
});

$('button').on('click', function(){
    $('.inpsearch').val('');
    $('.inpsearch').trigger('keyup');
    // console.log expected here
 });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='search' class='inpsearch'>
<button>CLICK</button>

Обратите внимание, что события keydown, keypress и keyup несут с собой информацию о клавишах-модификаторах Ctrl, Shift и Alt в свойствах ctrlKey, shiftKey и altKey соответственно, а событие input не будет.