Как включить кнопку при вставке чего-либо с помощью мыши? - PullRequest
Новая
       24

Как включить кнопку при вставке чего-либо с помощью мыши?

0 голосов
/ 23 ноября 2018

У меня есть текстовое поле и кнопка.Функциональность заключается в том, что всякий раз, когда текстовое поле пусто, кнопка отключается, а если не пусто, то кнопка активируется.Я делаю это, используя следующий код jQuery: 

$('#user_field').keyup(function(){
if($(this).val().length !=0){
    $('#btn_disabled').removeAttr('disabled'); 
    $('#btn_disabled').attr('class', 'upload_button_active');
}
else{
    $('#btn_disabled').attr('disabled',true);
    $('#btn_disabled').attr('class','upload_button_inactive');

}
})

Однако, когда я пытаюсь вставить ввод с помощью мыши, кнопка не активируется.Я попытался связать другие события мыши, такие как mousemove, но чтобы это работало, мы должны переместить мышь после вставки.Я хочу избежать этого.Предложите что-нибудь еще.

Смотрите изображение здесь

Ответы [ 3 ]

0 голосов
/ 23 ноября 2018

Вы можете использовать событие paste и получить значение ввода внутри setTimeout 

$('#user_field').on('paste input', function() {
  setTimeout(() => {
    if ($(this).val().length !== 0) {
      $('#btn_disabled').removeAttr('disabled');
      $('#btn_disabled').attr('class', 'upload_button_active');
    } else {
      $('#btn_disabled').attr('disabled', true);
      $('#btn_disabled').attr('class', 'upload_button_inactive');

    }
  }, 1000)
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' id='user_field'>
<button id='btn_disabled' disabled='disabled'>Click</button>
0 голосов
/ 23 ноября 2018

Просто вызовите функцию при изменении.Он также примет ваше входное событие от мыши. 

$("#textBox").change(function(
 var val=$(this).val();
  if(val.length===0){
  $("#btn").prop("disabled",true);
 }else{
  $("#btn").prop("disabled",false);
 }
});
0 голосов
/ 23 ноября 2018

Вы должны использовать 'input' 

$("#tbx").on('input',function(){
  var tbxVal=$(this).val();
  if(tbxVal.length===0){
    $("#btn").prop("disabled",true);
  }else{
    $("#btn").prop("disabled",false);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="tbx">
<button id="btn" disabled>Button</button>
...