Очистка поля ввода текста после очистки другого

Question

У меня есть текст 2 <input> s. Я хочу, чтобы textbox1 был очищен после того, как textbox2 очистится, удалив текст textbox2 или нажав кнопку «X» в левой части текстового поля. Есть ли способ обнаружить очистку текстового поля или добавить событие к кнопке «X»?

Answer 1

HTML:

<input type="text" id="txtbox1"> 
<input type="text" id="txtbox2"> 
<button id="btnX">X</button> 

JS:

document.getElementById("txtbox2").addEventListener("keyup", handler); 
document.getElementById("btnX").addEventListener("click", handler); 

function handler() { 
    txt1 = document.getElementById("txtbox1") 
    txt2 = document.getElementById("txtbox2") 
    if(txt2.value == ""){ 
     txt1.value = "" 
    } 
} 

Demo

Answer 2

вы можете использовать KeyUp событие на TextBox1 для ноу когда текстовое поле пусто

$('#txt1').on('keyup', function() { 
 
    if ($('#txt1').val().trim().length == 0) { 
 
    $('#txt2').val(''); 
 
    } 
 
}); 
 
$('.deleteText').click(function() { 
 
    $('#txt1').val(''); 
 
    $('#txt2').val(''); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input type="text" id="txt1" value='delete it' /><span class='deleteText'>X</span> 
 
<br/> 
 
<input type="text" id="txt2" value='test value' />