javascript - 为什么js回调函数会报错

Question

我有以下 JS:

$(document).ready(function (e) {
    $(".pStyle").CapFirstWord();
});
function CapFirstWord() {
    $word = $(this);
    var k = $word.length;
    alert(k);
}

HTML:

<p class="pStyle">Of all of these "new" selectors, ::nth-letter is likely the most useful. For instance, Lettering.js wraps letters in for us so that we can select individual letters. This would be entirely unnecessary with ::nth-letter.</p>

我正在尝试创建一个回调函数，可以从其他页面调用该函数来显示给定类/id 的长度。

我怎样才能实现这一目标。

Answer 1

如果您希望能够在 jQuery 选择器之后链接您的函数，您可以使用 its $.fn.extend() method 扩展 jQuery 的默认功能。 :

$.fn.extend({
    CapFirstWord: function() {
        $word = $(this);
        var k = $word.length;
        alert(k);
    }
});

The jQuery.fn.extend() method extends the jQuery prototype ($.fn) object to provide new methods that can be chained to the jQuery() function.

然后你可以调用$(".pStyle").CapFirstWord();。

演示

$.fn.extend({
    CapFirstWord: function() {
        $word = $(this);
        var k = $word.length;
        alert(k);
    }
});

$(document).ready(function (e) {
    $(".pStyle").CapFirstWord();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p class="pStyle">Of all of these "new" selectors, ::nth-letter is likely the most useful. For instance, Lettering.js wraps letters in for us so that we can select individual letters. This would be entirely unnecessary with ::nth-letter.</p>