"inputbutton" als text und hotkey?

[heroldini]

Hi@all
hab mich grade hier angemeldet, weil ich in den nächsten Wochen und Monaten bisl was größeres vorhabe und wahrscheinlich noch viele Fragen habe...

Wems interessiert: Ich kann html (version letztes jahrtausend) relativ Profimäßig, versteh javascript auch wenn ich es nicht selbst programmieren kann (zum abändern reichts aber ) und mit css hab ich mich in den letzten tagen erstmal intensiver auseinandergesetzt, bin aber noch schwer in der lernphase. Außerdem bin ich php-programmierer im fortgeschrittenen Stadium ;)
- soviel zu mir *g*

jetzt zu meiner Frage...

habe folgendes loginformular:

<div class="standart-box-title">Login</div>
<div class="standart-box-body">
<form name="login" action="index.php?login=check" method="post">
<p>Nickname:<br><input type="text" name="name"></p>
<p>Passwort:<br><input type="password" name="pwd"></p>
<ul>
<li><a href="javascript:login.submit();">login</a></li>
</ul>
</form>
</div>

der button ála "Login" ist als text aufgeführt und nicht als hässlicher kasten ;)

meine Frage: gibts da irgendwie die möglichkeit, das der link per "enter"taste aktiviert wird? sozusagen, wenn ich das passwort eingegeben hab, das ich dann nur noch enter tipen muss und fertig? weil so wie es jetzt ist, scheint es leider nicht zu funktioniern :(

Vielen dank!

gruß heroldini

P.S.: wenn jemand verbesserungsvorschläge bezüglich meines html's hat, darf er die gerne äußern (wie gesagt, beherrsche momentan eher noch das veraltete html ;p )

 

[_Thor_]

Du könntest den Inputfeldern ein onkeypress geben und den Code für Enter (müsste 13 sein) abfangen, aber ich würde es lassen und nen button oder ein input nehmen, denn ohne Javascript wird deins sonst nicht funktionieren.

Verbesserungsvorschlag:

<fieldset>
  <legend>Login</legend>
  <label for="name">Name:</label>
  <input type="text" id="name" value="name" />
  <label for="password">Password:</label>
  <input type="password" id="password" value="" />
</fieldset>

Nebenbei kannst du den Button auch per CSS so formatieren, dass er nicht als Button aussieht. Rahmen und Hintergrundfarbe entfernen, sollte schon fast reichen.

 

[heroldini]

ah danke für die antwort!

des mit dem hoverbutton ist mir noch gar nicht eingefallen, merci! ;)

werde mal einwenig damit herumexperimentieren!
nebenbei würde das auch das problem "upload ohne button" lösen, da es anscheindend ein größeres problem darstellt :)


Thema javascript: bin momentan sowieso noch am überlegen, wie ich das thema JS handhabe...
benutz ich es, benutz ich es nicht, oder nur mit phpIF-abfrage... :/
weil es doch ab und zu recht tolle dinge gibt...



zum verbesserungsvorschlag:
was bringt das for="" im label-tag?

 

[_Thor_]

Alles, was per Formular an deinen Server geschickt wird, solltest du per serverseitiger Scriptsprache (z.B. PHP) prüfen, Javascript kann man abschalten und wenn du dann die Sachen ungeprüft verarbeitest, kann das zu Sicherheitsproblemen führen.

Mit dem Attribut for bindest du das Label an das zugehörige Feld, dazu braucht das Feld eine ID, die du im Label angibst. Dann bekommt das Feld auch den Focus, wenn du auf den (oder das?) Label klickst.

 

[heroldini]

Alles, was per Formular an deinen Server geschickt wird, solltest du per serverseitiger Scriptsprache (z.B. PHP) prüfen, Javascript kann man abschalten und wenn du dann die Sachen ungeprüft verarbeitest, kann das zu Sicherheitsproblemen führen.

jo logisch... ich dachte da eher an gestallterische dinge, wie eben unser beispiel mit dem button ;)


wie muss ich das mit dem focus verstehen? bzw was lässt sich z.b. dadurch bewirken?

 

[neuroleptika]

wie muss ich das mit dem focus verstehen? bzw was lässt sich dadurch bewirken?

focus lässt sich durch die Tab-Taste anspringen.
Ein fokus auf label würde zum zugehörigen input führen.

Probiere es aus.
Klicke auf den Inhalt von focus (oder Tabbe es an).
Das zugehörige input sollte dann aktiv sein.

 

[_Thor_]

ich dachte da eher an gestallterische dinge, wie eben unser beispiel mit dem button

Und wenn jemand in deinem Beispiel Javascript deaktiviert hat, kann das Formular garnicht abgeschickt werden.

Javascript sollte ergänzend eingesetzt werden, die Seite sollte aber auch ohne Javascript noch voll funktionstüchtig sein, dazu gehört auch das Absenden eines Formulars.

wie muss ich das mit dem focus verstehen? bzw was lässt sich dadurch bewirken?

Probier es doch aus. Klick in deinem Beispiel mal auf den Text, den zu vor dem Input stehen hast und mach es mal in meinem Beispiel. Der Benutzer hat dadurch den Vorteil, dass er nicht unbedingt den kleinen Radiobutton treffen muss, sondern auch auf den Text klicken kann und das Feld wird markiert. Screenreader können so auch Beschriftung und Feld besser zuordnen.

 

[heroldini]

cool wusst ich noch garnet :)

jo dann mal danke für die hilfe... meld mich wieder wenn ich wieder probleme hab^^

gruß heroldini