2

我有一个 div：

<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; });
    });

如何在不包含 JQuery 库的情况下在 JavaScript 中实现此代码？

4

3 回答 3

2

您可以在不使用 jquery 的情况下在 javascript 中执行此操作，此处提供演示JsFiddle 您可以将其放在 body 的 onload 方法中，然后它将调用 body 的 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-26T05:12:13.480 回答
1 
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-26T05:17:34.280 回答
1

Adil 的想法是正确的，但要稍微改进一下，您可以将元素存储在变量中，这样您就不必每次都调用来获取元素。所以我会把它改成这样：

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");}

赞成 Adil 击败我并提供 jsfiddle 链接 :)

更新：没关系，因为你刚刚更新了你的帖子

于 2012-04-26T05:26:10.783 回答