Question

为什么console.log(this.attr("id"));的调用是未定义的？

(function( $ ) {
    $.fn.fs_suggest = function(options) {
        console.log(this.attr("id"));
    };
})( jQuery );

$("#places_search").fs_suggest();

这是HTML：

<div class="search_container" id="search">
    <form data-remote="false" method="get" action="/search">
        <input type="text" placeholder="search places" name="query" id="places_search">
        <input type="submit" value="search">
    </form>
</div>

我正在尝试获取对调用.fs_suggest（）函数的元素的引用，在本例中为$（“＃places_search”）

Answer 1

我想你想要这个：

console.log($(this).attr("id"));

除非我弄错了，this指的是一个DOM元素（没有attr函数），而$(this)则取实际的jQuery对象（确实如此）。

如果这个（或者我的意思是this？hehehe ...）不起作用那么你只是在错误的选择器上调用该函数。

进一步阅读jQuery文档后，您的问题似乎出现在您提供给我们的上下文之外的其他地方。你是否在DOM正确加载之前调用了你的插件？（例如在$(document).ready()之外）

Answer 2

我不是100％用这种表示法产生的东西：

$.fn.fs_suggest = function(options) {
...

但是如果$.fn解析为Object而fs_suggest是该Object的属性，那么函数内的this将引用该对象而不是DOM元素或jQuery包装元件。

Answer 3

我已经解决了这个问题。问题是我没有在doc ready块中调用fs_suggest（）。所以答案是这样称呼它。

places.js.coffee：

$ ->    
    $("#places_search").fs_suggest()

并在另一个文件中插件：

(function( $ ) {
    $.fn.fs_suggest = function(options) {
        console.log(this.attr("id"));
    };
})( jQuery );

现在会看到“this”，并且等同于$（“＃places_search”）。

jQuery插件this.attr（“id”）未定义

3 个答案: