js clickとonclick事件は結び付けて、触発して縛りを解きます.

1916 ワード

clickとonclick 1.onclickイベントは対象がクリックされた時に発生します.

function test() {
    alert("      ");
}
id=「btn 1」をクリックすると、Oclickイベントが発生します.
2.onclickイベントはclickイベントの前に実行されます.

var btn2 = document.getElementById('btn2');
btn2.addEventListener('click', showMsg, false); //         showMes      
function showMsg() {
    alert("    ");
}
ID="btn 2"をクリックした場合、まずオンリーイベントの方法test()を実行し、またclickイベントのshowMsg()の方法を実行します.
jsバインディングクリックイベントの方法1:onclickをラベルに結び付け、HTML要素行間イベント(HTMlイベントハンドラともいう)を、直接htmlラベルにイベントを追加します.短所:htmlとjsコードは緊密に結合しています.

方法二:onclickのjs結合方法
//                  。(       Dom0       )
var btn1 = document.getElementById('btn1');
function abc() {
    alert('abc');
}
btn1.onclick = abc; //        abc    ,    btn1.onclick=function abc(){alert('abc');}
//btn1.onclick = null; //       
方法3:clickのjsバインディング方法(jsの場合はこのようなことをオススメします.)
//  “    ”        (  Dom2       )
var btn2 = document.getElementById('btn2');
btn2.addEventListener('click', showMsg, false); //         showMes      
function showMsg() {
    alert("    ");
}
//btn2.removeEventListener('click', showMsg, false); //    
jsトリガクリックイベントは手動クリック以外に、jsもクリックイベントをトリガすることができます.
  • .onclick()
  • document.getElementById("btn2").onclick();
    
    この種の事件はオンロック事件を触発するだけです.
  • .click()
  • document.getElementById("btn2").click();
    
    このような会はまずOclick事件を出発して、更にclick事件を触発します.
    js解縛クリック事件の方法解縛onclick
    btn1.onclick = null; //       
    
    縛りを解く
    btn2.removeEventListener('click', showMsg, false); //