Question

如何使用参数变量＆＃34; id ＆＃34;来自＆＃34; BubbleGum.prototype.ToolBar = function（id ）＆＃34;通过功能＆＃34; checkmousepos（e，id）＆＃34;身体范围？。

我尝试使用内联方法 onClick ，传统方法 element.onClick = dosomething（）; 和W3C Standard和microsoft方法元素。 addEventListener 发生同样的问题，变量id = undefined。

有人可以因为对宇宙的热爱振动，为我提供了一个简洁而简单的答案，而不是一些棘手的黑客半垃圾。

BubbleGum.prototype.ToolBar = function(id) {

var TB = document.getElementById(id);

TB.style.position = "relative";
TB.style.marginLeft = (RootFrame.style.marginLeft);
TB.style.marginTop = "-22.0em";
TB.style.left = "0em";
TB.style.top = 0;
TB.style.height = "2em";
TB.style.width = (RootFrame.style.width);
TB.style.color = "black";
TB.style.backgroundColor = "#6a071a";
TB.style.borderTopLeftRadius = "0.4em";
TB.style.borderTopRightRadius = "0.4em";
TB.style.textAlign = "center";

TB.onclick = checkmousepos(id);


function checkmousepos(e, id) {
    document.write(id);

    //var TB = document.getElementById(id);

    var mousex = e.pageX;
    var mousey = e.pageY;

    id.style.marginLeft = mousex + "px";


    //TB.addEventListener("mousemove",dick,false);
    //document.write("jello");
  };
};

Answer 1

此指向附加onclick的元素。传递this您可以访问elper方法checkmousepos

中的该元素

TB已指向所选元素 - 为什么不使用它？

function BubbleGum() {}

BubbleGum.prototype.ToolBar = function(id) {

    var TB = document.getElementById(id);
    
    TB.style.color = "green";
    TB.onclick = function(e) {
        checkmousepos(e, this)
    }
    
    
    function checkmousepos(e, id) {
        console.log('arg', arguments)
        var mousex = e.pageX;
        var mousey = e.pageY;
    
        id.style.marginLeft = mousex + "px";
    };
}
    
var s = new BubbleGum().ToolBar('toolbar');

<div id="toolbar">
    some content
</div>

Answer 2

您必须将回调分配为onclick处理程序，而在代码中调用checkmousepose函数并指定返回值，该值未定义，因为没有返回任何内容。

所以你必须返回一个将被指定为onclick处理程序的函数，如此

function checkmousepos(id) {
    return function(e){
        document.write(id);

        //var TB = document.getElementById(id);

        var mousex = e.pageX;
        var mousey = e.pageY;

        id.style.marginLeft = mousex + "px";


        //TB.addEventListener("mousemove",dick,false);
        //document.write("jello");
    }
};

Answer 3

id已经在BubbleGum.prototype.ToolBar闭包上下文中，所以它是可用的checkmousepos函数，只需使用它。

如何通过函数体范围从函数中使用参数变量？

3 个答案: