別のテキストをクリアした後にテキスト入力フィールドをクリアする

Question

私は2つのテキスト<input>を持っています。 textbox2のテキストを削除するか、テキストボックスの左側にある "X"ボタンをクリックして、textbox2を消去した後でtextbox1をクリアします。テキストボックスのクリアを検出する方法や、「X」ボタンにイベントを追加する方法はありますか？

Answer 1

HTML：

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

JS：テキストボックスが空のときに、あなたが知っているためのTextBox1にイベントをからkeyup使用することができます

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

$('#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' />