在javascript中將變量傳遞給函數

Question

我不確定我的代碼有什么問題。 我一直為maxLength獲取一個NaN變量。 我正確地寫這個功能了嗎？

我試圖打電話的助手功能：

(function($) {
    $.fn.countRemainingCharactersHelper = function(maxLength) {
        id = this.attr('id');
        var textLength = this.val().length;
        var textRemaining = maxLength - textLength;

        if (textLength >= maxLength) {
            textRemaining = 0;
        }

        var messageId = id.slice(0, (id.indexOf('someTxtBox'))) + 'someTxtBox';
        $('#' + messageId).html(textRemaining + ' characters remaining.');
    };
})(jQuery);

調用上面的輔助函數的函數：

function countRemainingCharacters() {
    $(this).countRemainingCharactersHelper(1000);
}

function countRemainingCharacters(maxLength) {
    $(this).countRemainingCharactersHelper(maxLength);
}

調用函數傳遞maxLength變量

$('#samplesomeTxtBox').click(function() {
    countRemainingCharacters(4000);
});

Answer 1

this將引用countRemainingCharacters()函數中的window ，因為您不使用范圍調用它。 你可以使用call()修復它：

$('#samplesomeTxtBox').click(function() {
    countRemainingCharacters.call(this, 4000);
})

另請注意，用於生成放置消息的元素的id的邏輯稍微偏離。 您可以通過使用data屬性顯式設置元素ID來改進它。

在這種情況下，您的重載方法也是多余的，因為如果沒有提供默認值，您可以利用JavaScripts'falsy'邏輯來提供默認值。 這意味着您可以將兩個countRemainingCharacters()函數轉換為一個：

function countRemainingCharacters(maxLength) {
    $(this).countRemainingCharactersHelper(maxLength || 1000);
}

工作實例

此時剩下的就是創建一個鍵事件處理程序來計算用戶輸入的剩余字符。