在調用JavaScript函數像JQuery的

我有一個div：在調用JavaScript函數像JQuery的

<div id="test" style="width:auto; height:auto;"> 
</div>

和一個功能：

$(function() { 
      $("#test").attr("contentEditable", "true"); 
      $("#test") 
      .attr("tabindex", "0") 
      .keydown(function(){ alert(1); return false; }) 
      .mousemove(function(){ alert(2); return false; }); 
    });

我如何能實現在JavaScript的代碼，而不包括jQuery庫？

來源

2012-04-26 Kichu

您定位了哪些瀏覽器？ – Cameron 2012-04-26 05:02:59

firefox，即chrome – Kichu 2012-04-26 05:03:22

ie的哪個版本？舊版IE的事件處理需要額外的代碼。 – kinakuta 2012-04-26 05:09:28

你可以像下面這樣做在JavaScript不使用jQuery，可以在這裏JsFiddle 你可以把它放在身體的onload方法，那麼它會調用身體的onload事件或只是把它放在下面的所有控制腳本部分，而不把它演示在函數中，它會調用文檔準備好像jquery方法$（）。ready（）;

var test = document.getElementById('test'); 
test.setAttribute("contentEditable", "true"); 
test.setAttribute("tabindex", "0"); 
test.onkeydown = function(event) { alert("KeyDown");}  
test.onmousemove = function(event) { alert("MouseMove");}

來源

2012-04-26 05:12:13 Adil

您可以找到該元素並將其保存在一個變量中，以避免重複調用'.getElementById（）'，除非您真的喜歡打字。 – Pointy 2012-04-26 05:20:27

我剛剛那樣做了，並且還更新了描述 – Adil 2012-04-26 05:21:48

@pointy不打字，只是複製粘貼;）， – 2012-04-26 05:30:38

function runme() { 
    var elm = document.getElementById("test"); 
    elm.contentEditable = "true"; 
    elm.tabIndex = 0; 
    elm.onkeydown = function() { alert(1); return false; }; 
    elm.onmousemove = function() { alert(2); return false; }; 
} 

if(window.addEventListener) 
    window.addEventListener("load", runme, false); 
else 
    window.attachEvent("onload", runme);

來源

2012-04-26 05:17:34

阿迪爾看法是正確的，但在它改善了一點，你可以在元素存儲在一個變量，所以你不必撥打電話，每次得到的元素。所以我想改變它看起來是這樣的：

var t = document.getElementById('test'); 

t.setAttribute("contentEditable", "true"); 
t.setAttribute("tabindex", "0"); 
t.onkeydown = function(event) { alert("KeyDown");}  
t.onmousemove = function(event) { alert("MouseMove");}

Upvoted阿迪爾毆打我，併爲提供的jsfiddle鏈接:)

更新：沒關係，因爲你剛剛更新您的文章

來源

2012-04-26 05:26:10 Sam

在調用JavaScript函數像JQuery的

回答

相關問題