Ändern Sie die Eingabe in Großbuchstaben

JS:

<script type="text/css">
$(function() {
    $('#upper').keyup(function() {
        this.value = this.value.toUpperCase();
    });
});
</script>

HTML

<div id="search">
        <input type="radio" name="table" class="table" value="professor" tabindex="1" /> Professor
        <input type="radio" name="table" class="table" value="department" tabindex="2" /> Department
        <input type="radio" name="table" id="upper" class="table" value="course" tabindex="3" /> Course
        <input type="text" name="search" class="keywords" value="Select an option..." onclick="this.value='';" onfocus="this.select()" onblur="this.value=!this.value?':this.value;" tabindex="4"  />
        <div id="content"> </div>
    </div>

Warum ist dies immer noch nicht funktioniert?? Gerade versuchen aufzurufen div ".Stichwörter" von JS.

Kommentar zu dem Problem

Ich wünschte, ich hätte Zeit, sich zu setzen, was ich glaube, ist die beste Antwort hier. Es ist zum verarbeiten des keypress-Ereignisses und ändern Sie den keycode in Großbuchstaben, sofern zutreffend, es ist einfacher als es klingt, um cross-browser-kompatibel, aber ich denke, es ist die beste Lösung. Kommentarautor: Juan Mendes

Eigentlich die Lösung, die ich dachte, der funktioniert nur mit IE... e.die readonly ist in FF und WebKit, aber IE können Sie ändern, e.keyCode. Versuchen Sie es in IE jsfiddle.net/48fSq/1 Kommentarautor: Juan Mendes

InformationsquelleAutor der Frage Jshee | 2011-04-22

javascript jquery

209

Ich denke, der eleganteste Weg ist ohne javascript, aber mit css. Sie können text-transform: uppercase (das ist inline nur für die Idee):
```
<input id="yourid" style="text-transform: uppercase" type="text" />
```
Edit:

So, in Ihrem Fall, wenn Sie wollen, Schlüsselwörter werden in Großbuchstaben ändern:
keywords: $(".keywords").val(), zu $(".keywords").val().toUpperCase(),

InformationsquelleAutor der Antwort Tim

Javascript string-Objekte haben eine toLocaleUpperCase() Funktion macht die Umwandlung einfach.

Hier ist ein Beispiel live-Kapitalisierung:

$(function() {
    $('input').keyup(function() {
        this.value = this.value.toLocaleUpperCase();
    });
});

Leider, dies setzt die textbox-Inhalte vollständig, so dass der Benutzer die Cursor-position (wenn nicht "das Ende der textbox") ist verloren.

Können Sie diesen hack wieder in, obwohl, bei einigen browser-Wechsel magic:

//Thanks http://blog.vishalon.net/index.php/javascript-getting-and-setting-caret-position-in-textarea/
function getCaretPosition(ctrl) {
    var CaretPos = 0;    //IE Support
    if (document.selection) {
        ctrl.focus();
        var Sel = document.selection.createRange();
        Sel.moveStart('character', -ctrl.value.length);
        CaretPos = Sel.text.length;
    }
    //Firefox support
    else if (ctrl.selectionStart || ctrl.selectionStart == '0') {
        CaretPos = ctrl.selectionStart;
    }

    return CaretPos;
}

function setCaretPosition(ctrl, pos) {
    if (ctrl.setSelectionRange) {
        ctrl.focus();
        ctrl.setSelectionRange(pos,pos);
    }
    else if (ctrl.createTextRange) {
        var range = ctrl.createTextRange();
        range.collapse(true);
        range.moveEnd('character', pos);
        range.moveStart('character', pos);
        range.select();
    }
}


//The real work

$(function() {
    $('input').keyup(function() {
        //Remember original caret position
        var caretPosition = getCaretPosition(this);

        //Uppercase-ize contents
        this.value = this.value.toLocaleUpperCase();

        //Reset caret position
        //(we ignore selection length, as typing deselects anyway)
        setCaretPosition(this, caretPosition);
    });
});

Letztlich ist es eventuell am einfachsten zu fälschen. Legen Sie die style - text-transform: uppercase auf das Textfeld, so dass es erscheint Großbuchstaben an den Benutzer, dann in deinem Javascript gelten die text-transformation-einmal, wenn der Benutzer die Cursor-Fokus lässt die textbox ganz:

HTML:

<input type="text" name="keywords" class="uppercase" />

CSS:

input.uppercase { text-transform: uppercase; }

Javascript:

$(function() {
    $('input').focusout(function() {
        //Uppercase-ize contents
        this.value = this.value.toLocaleUpperCase();
    });
});

Hoffe, das hilft.

InformationsquelleAutor der Antwort Lightness Races in Orbit

6

Können es auch tun, auf diese Weise aber auch andere Möglichkeiten scheinen besser zu werden, die in handliches kommt, wenn Sie nur brauchen, es das einmal.
```
onkeyup="this.value = this.value.toUpperCase();"
```
InformationsquelleAutor der Antwort Crouch

versuchen:

$('#search input.keywords').bind('change', function(){
    //this.value.toUpperCase();
    //EDIT: As  Mike Samuel suggested, this will be more appropriate for the job
    this.value = this.value.toLocaleUpperCase();
} );

InformationsquelleAutor der Antwort BiAiB

4

Wenn Sie Sinn und Zweck es für html-Eingabe,
Sie können ganz einfach tun dies, ohne die Verwendung von javascript.
Es wäre standard und sehr einfach zu benutzen moderne CSS-tag:
```
<input type="text" style="text-transform: uppercase" >
```
oder Sie können ein bootstrap-Klasse mit dem Namen "text-Großbuchstaben"
```
<input type="text" class="text-uppercase" >
```
InformationsquelleAutor der Antwort Ebrahim
2

Konnte ich nicht finden die text-Großbuchstaben in der Bootstrap bezeichnet, die in einer der Antworten. Egal, ich habe es;
```
.text-uppercase {
  text-transform: uppercase;
}
```
Dieser zeigt den text in Großbuchstaben, aber die zugrunde liegenden Daten nicht transformiert auf diese Weise.
Also jquery ich habe;
```
$(".text-uppercase").keyup(function () {
    this.value = this.value.toLocaleUpperCase();
});
```
Dies wird sich ändern die zugrunde liegenden Daten dort, wo Sie verwenden Sie die text-Großbuchstaben-Klasse.

InformationsquelleAutor der Antwort arame3333
2
```
onBlur="javascript:{this.value = this.value.toUpperCase(); }
```
ändern Großbuchstaben leicht.

Demo Hier

InformationsquelleAutor der Antwort Venkat

**JAVA SCRIPT**
<html>
<body>
<script>
function @ToCaps(obj)
{
obj.value=obj.value.toUpperCase();
}
</script>
<input type="text" onkeyup=@ToCaps(this)"/>
</body>
</html>

**ASP.NET**
Use a css style on the text box, write css like this:

.ToCaps { text-transform: uppercase; }

<asp:TextBox ID="TextBox1" runat="server" CssClass="ToCaps"></asp:Te writxtBox>

**OR**
simply write this code in textbox
<asp:TextBox ID="TextBox1" runat="server" style="text-transform:uppercase"></asp:TextBox>


 **1.Note you don't get intelligence until you type up to style="**

InformationsquelleAutor der Antwort Shashi Kiran Jillepally

0

Javascript hat eine toUpperCase() Methode. http://www.w3schools.com/jsref/jsref_toUpperCase.asp

So, wo Sie denken, am besten legen Sie es in Ihrem code, Sie hätte etwas zu tun, wie
```
$(".keywords").val().toUpperCase()
```
InformationsquelleAutor der Antwort
0

Diese Antwort hat ein problem:
```
style="text-transform: uppercase"
```
setzt auch die Platzhalter Wort in Großbuchstaben, was umständlich ist
```
placeholder="first name"
```
beim Rendern der Eingang, es schreibt "der Vorname" als Platzhalter in Großbuchstaben
```
FIRST NAME
```
also schrieb ich etwas besser:
```
onkeypress="this.value = this.value + event.key.toUpperCase(); return false;"
```
es funktioniert gut!, aber es hat einige Nebenwirkungen, wenn Sie Ihre javascript-code ist Komplex,

hoffe, es hilft jemandem, um ihm/Ihr eine Idee zu entwickeln, eine bessere Lösung.

InformationsquelleAutor der Antwort Tarık Seyceri

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.