JQuery Mobile - Anzeige eines HTML-Formulars Inline

7

Ziel: Textbox anzeigen und Schaltfläche in derselben Zeile in Jquery Mobile senden.

Problem: Sie werden nicht in derselben Zeile angezeigt.

Ich habe oft versucht, die Textbox und die Schaltfläche "Senden" in derselben Zeile anzuzeigen, aber das funktioniert nie. Hier ist mein Code und die Kombinationen, die ich benutzt habe ...

%Vor%

Das hat nicht funktioniert.

%Vor%

Das war auch nicht.

%Vor%

Was mache ich falsch und wie kann ich mein Ziel erreichen?

Danke und frohe Weihnachten!

    
Joe 22.12.2011, 15:49
quelle

3 Antworten

14

Würde ein Rasterlayout funktionieren?

HTML:

%Vor%     
Phill Pafford 22.12.2011, 16:02
quelle
6

Sie können eine Medienabfrage verwenden, um die Schaltfläche inline mit der Texteingabe für größere Bildschirmbreiten anzuzeigen und die Textbox über der Schaltfläche zum Senden für kleinere Bildschirmbreiten anzuzeigen:

%Vor%

Hier ist eine Demo: Ссылка

Ich verwende die Klassen, die von jQuery Mobile hinzugefügt wurden, um die Elemente zu targetieren. Dies ist besonders nützlich für die Arbeit mit der Schaltfläche "Senden", da die HTML-Struktur nach dem Initialisieren von jQuery Mobile nicht dem perinitialisierten Element ähnelt.

Hier wird der HTML-Code des Absenden-Buttons angezeigt, nachdem jQuery Mobile ihn initialisiert hat:

%Vor%

Wenn Sie IE7 unterstützen möchten, müssen Sie den folgenden Code hinzufügen, weil IE7 display : inline-block nicht versteht:

%Vor%     
Jasper 22.12.2011 18:41
quelle
0

Fügen Sie sie in zwei separate Spalten innerhalb einer Zeile der HTML-Tabelle hinzu.

    
Sriharsha C R 29.10.2016 14:45
quelle