Question

我想通过特定的id调用下面的函数（focusOnfn.focusOn（））。我们在jquery中调用$("#selectorId").function();

   var focusOnfn = function(){
        value: $(this).val(),
        focusOn: function(){
            alert($(this).val())
        }
    }

请参阅此示例http://jsfiddle.net/gopalan100/ZSwe8/8/

先谢谢

Answer 1

截至撰写本文时，您的问题有点模糊。

我相信你问的是如何在不使用jQuery的情况下通过CSS选择器进行查询。如果是这种情况，您可以使用querySelectorAll对象的document函数：

document.querySelectorAll("#myId"); //simple ID selector, use .getElementById instead
document.querySelectorAll("p.linksAreSpoilers a:hover"); // good use case, when selecting from a complex source

这仅适用于现代浏览器，因为它最近已添加到规范中。

如果您需要跨浏览器版本，可以查看jQuery核心选择器库Sizzle。

如果你想创建一个支持jQuery-esque语法的库，你可以使用继承，如这个小提琴所示： http://jsfiddle.net/h6KzL/1/

//Create a constructor, this is just a function that returns nothing and sets its own properties (this.<SOMETHING>)
function ElementObject(query) {
    this.elements = document.querySelectorAll(query);
}
//Add functions to the constructor's prototype
ElementObject.prototype.getFirst = function () {
    return this.elements[0];
}

//Create our "public" function, ideally all code above would be private (e.g. inside a module or something similar
function $(query) {
    return new ElementObject(query);
}

alert($("#myDiv").getFirst());

请注意，使用$作为库的函数是一个坏主意，因为很多人使用$来表示jQuery。

Answer 2

我想你想做这样的事情

 $("#selectorId").on('focusOn', function(){
        value: $(this).val(),
        focusOn: function(){
            alert($(this).val())
        }
    }
$("#selectorId").trigger('focusOn');

“ Javascript way ”：

var myEl = document.querySelector("#selectorId");
myEl.addEventListener("focusOn", function(e) {
    // what ever here
});
// Trigger
myEl.dispatchEvent(focusOn);

Answer 3

您可以尝试以下操作。

Object.prototype.focusOnfn = function() {
    return {
        value: this.value,
        focusOn: function(){
            alert(this.value);
        }
    }
}

关于javascript函数结构

3 个答案: