Website-Suche

javascript - Wie zeigt man Ellipsen in einem schreibgeschützten Eingabefeld im Android-Standardbrowser an?


Wie stellt man ein Eingabefeld so ein, dass Ellipsen angezeigt werden, wenn der Text zu lang ist? Das Eingabefeld ist nur lesbar und seine Breite ist auf 100 % eingestellt.

Ist das möglich? Wenn nicht, wie macht man das in JavaScript?

Hinweis: Während dies in Chrome zu funktionieren scheint, funktioniert es im Android-Standardbrowser nicht.

Mein aktuelles CSS für das Eingabefeld:

white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

Danke!

Antwort #1

Je nach Ihren Anforderungen können Sie CSS's text-overflow verwenden, um dies zu erreichen:

HTML :

<input disabled="disabled" value="really really long text that will be trunked" />

CSS

input{
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    width: 100px;
}

Demo: http://jsfiddle.net/yrPc8/

Antwort #2

Ich denke, diese Antwort wird dir helfen

Sie können eine Klasse erstellen und sie auf Ihr Textbox
HTML anwenden

<input type="text" readonly value="Lorem ispum dolor sit amit Lorem ispum dolor sit amit Lorem ispum dolor sit amit Lorem ispum dolor sit amit " class="ellipsis">

CSS

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}

Um die Android-CSS-Textüberlauf-Probleme laut Ben zu beheben

*{
    text-rendering: optimizeLegibility;
}

Sieh es dir hier live an http://jsfiddle.net/b4YjX/