0

我正在努力了解如何将一段 javascript 从突兀变为不突兀，有人能解释一下吗？

这是脚本：

function limitText(limitField, limitCount, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    } else {
        limitCount.value = limitNum - limitField.value.length;          
    }

这是 JSFiddle：http: //jsfiddle.net/pxmmh/

4

3 回答 3

1

不是太难。你甚至不需要 jQuery。

http://jsfiddle.net/pxmmh/4/

// your function you have now
function limitText(limitField, limitCount, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    } else {
        limitCount.value = limitNum - limitField.value.length;
    }
}

// bind event handlers to the DOM
var field = document.getElementById('limited');
field.onkeydown = function() {
    var counter = document.getElementById('limited-count');
    var limit = parseInt(field.dataset.limit, 10)
    limitText(field, counter, limit);
};

字段和计数器已被赋予 id，让我们能够找到它们。限制现在是一个data-*HTML5 属性，我们可以使用.datasetJavaScript 中的属性访问，它允许元素说出它自己的限制是什么。

于 2013-03-13T20:54:04.593 回答
0

在这种情况下，它并不是很突兀。如果 JS 关闭，则不会破坏任何重要内容。但是，您想要做的是在 onload 中附加事件，并在默认情况下隐藏或不存在“您还剩下 X 个字符”的段落。取消隐藏或添加相同的 onload，因为它仅在 JS 运行时才有用。

于 2013-03-13T20:40:39.240 回答
0

如果你想要一个真正不引人注目的解决方案，一些 jQuery 将为你创造奇迹

$(document).ready(function () {

    $('#limitedtextfield').keyup(function () {
        limitText(this.form.limitedtextfield, this.form.countdown, 15);
    });

    $('#limitedtextfield').keydown(function () {
        limitText(this.form.limitedtextfield, this.form.countdown, 15);
    });

    function limitText(limitField, limitCount, limitNum) {
        if (limitField.value.length > limitNum) {
            limitField.value = limitField.value.substring(0, limitNum);
        } else {
            limitCount.value = limitNum - limitField.value.length;
        }
    }
});

请参阅此处的 JSFiddle http://jsfiddle.net/x65Kw/

于 2013-03-13T20:45:07.763 回答