更新

Question

我正在使用流行的Firefox扩展程序 Greasemonkey 。

我想知道是否有办法以某种形式大写所有文本输入，所以如果我使用jQuery，代码看起来像：

$('form#formid input[type=text]').capitalize();

现在我当然知道.capitalize()不是一个有效的函数，为了大写文本，你需要一个复杂的JavaScript代码，但毕竟谷歌搜索，我找不到一个似乎可以实施到Greasemonkey。

有人可以帮我写这个剧本吗？

通过大写，我的意思是大写每个单词的第一个字母，比如CSS text-transform:capitalize;，它必须覆盖用户可能放入的字母，也许在表单提交上更容易。

感谢。

Answer 1

//add a function to jQuery so we can call it on our jQuery collections
$.fn.capitalize = function () {

    //iterate through each of the elements passed in, `$.each()` is faster than `.each()
    $.each(this, function () {

        //split the value of this input by the spaces
        var split = this.value.split(' ');

        //iterate through each of the "words" and capitalize them
        for (var i = 0, len = split.length; i < len; i++) {
            split[i] = split[i].charAt(0).toUpperCase() + split[i].slice(1);
        }

        //re-join the string and set the value of the element
        this.value = split.join(' ');
    });
    return this;
};

以下是演示：http://jsfiddle.net/jasper/qppGQ/1/

这可以在事件处理程序中使用，以始终保持大写的文本体：

//when the user presses a key and the value of the `textarea` is changed, the new value will have all capitalized words
$('textarea').on('keyup', function () {
    $(this).capitalize();
}).capitalize();//also capitalize the `textarea` element(s) on initialization

以下是演示：http://jsfiddle.net/jasper/qppGQ/2/

更新

要将第一个字母大写，并且单词的其余部分为小写，我们可以在大写第一个字母后在字符串的其余部分使用.toLowerCase()：

        ...
        for (var i = 0, len = split.length; i < len; i++) {
            split[i] = split[i].charAt(0).toUpperCase() + split[i].slice(1).toLowerCase();
        }
        ...

以下是演示：http://jsfiddle.net/jasper/qppGQ/3/

Answer 2

这是你想要做的吗？

(function ($) {

    $.fn.capitalize = function () {
        return this.val(function (i, oldValue) {
            return oldValue.charAt(0).toUpperCase() + oldValue.slice(1);
        });
    };

})(jQuery);

如果您想“实时”执行此操作，您只需处理事件内的操作：

(function ($) {

    $.fn.capitalize = function () {
        this.on('keyup.capitalize change.capitalize', function () { 
            $(this).val(function (i, oldValue) {
                return oldValue.charAt(0).toUpperCase() + oldValue.slice(1);
            });
        });
    };

})(jQuery);

Answer 3

我对一个大写函数的简单实现用空格分割一个字符串，并将每个单词的第一个字母大写。它假定每个单词除以至少一个空格。

function capitalize(text) {
    var i, words, w, result = '';

    words = text.split(' ');

    for (i = 0; i < words.length; i += 1) {
        w = words[i];
        result += w.substr(0,1).toUpperCase() + w.substr(1);
        if (i < words.length - 1) {
            result += ' ';    // Add the spaces back in after splitting
        }
    }

    return result;
}

控制台输出示例：

> capitalize("some tEsT e strING a B c 1 2 3")
  "Some TEsT E StrING A B C 1 2 3"

Answer 4

您将需要有问题的DOM对象的事件处理程序 - 特别是keypress事件处理程序。每次按键后，您需要读取输入字段的文本，以确保所有单词（由空格包围的文本）都具有大写的第一个字符。

例如：

$('form#formid input[type=text]').keypress(function(event) {
// Function body goes here
});

作为一般策略，我建议用空格分割输入字段的值（使用str.split(" ");）。然后，遍历每个结果字符串。对于每个字符串，在第一个字母后面切掉所有内容，并将大写的第一个字符附加到切片的字符串。您可以看到其他答案显示如何执行此操作。将所有这些字符串合并为一个，并将输入值设置为此大写字符串。

Answer 5

带有事件绑定的

版本

Simpl使用

$('input[type="text"]').capitalize()

http://jsfiddle.net/uUjgg/

(function($) {

$.fn.capitalize = function() {
    return this.each(function() {
        var $field = $(this);

        $field.on('keyup change', function() {
            $field.val(function(i, old) {
                if (old.indexOf(' ') > -1) {
                    var words = old.split(' ');
                    for (i = 0; i < words.length; i++) {
                        words[i] = caps(words[i]);
                    }
                    return words.join(' ');
                } else {
                    return caps(old);
                }
            });
        });
    });

    function caps(str) {
        return str.charAt(0).toUpperCase() + str.slice(1);
    }
};

})(jQuery);

Answer 6

我在这里接受了提示，并使用标准的javascript制作了一些更简单的东西。我需要在iPad Web App上大写输入框的每个单词，autocapitalize无法始终如一地工作。这是工作：

HTML输入

<input type="text" id="this_input" name="this_input" onkeyup="javascript:capitalize(this.id, this.value);">

的Javascript

<script type="text/javascript">
  function capitalize(textboxid, text) {
      // string with alteast one character
      var i, words, w, result = '';

    words = text.split(' ');

    for (i = 0; i < words.length; i += 1) {
        w = words[i];
        result += w.substr(0,1).toUpperCase() + w.substr(1);
        if (i < words.length - 1) {
            result += ' ';    // Add the spaces back in after splitting
        }
    }
      document.getElementById(textboxid).value = result;
  }
  </script>

用于大写文本输入的JavaScript代码

6 个答案:

更新