Einen Button als Link verwenden

[Severin Kacianka]

Hallo,

Irgendwie scheine ich im Moment nicht so ganz klar denken zu können. Ich will einen Input-Button als Link verwenden:

  
<a href="http://www.example.com"><input type="button" value="Foo"></a>  

Das funktioniert im Firefox, aber weder im IE noch im Konqueror. Ich geht also einmal davon aus, dass diese Notation falsch ist. Was wäre jetzt die beste Lösung für mein Problem?

  
<form action="http://www.example.com"><input type="submit" value="Foo"></form>  

Sieht für mich etwas "fett" aus.

Liebe Grüße und danke für eure Zeit,
Severin
Post Scriptum: Seit wann gibt es denn http://www.example.com nicht mehr?

[Severin Kacianka]

Hallo,

JavaScript Lösungen möchte ich natürlich vermeiden.

Gruß,
Severin

[Richard]

Hallo,

JavaScript Lösungen möchte ich natürlich vermeiden.

Dann verwende Textlinks!

Gruß aus MeckPomm

[Severin Kacianka]

Hallo,

Dann verwende Textlinks!

Ich hätte aber gerne die graphische Illusion, dass es einen <Formular senden> und einen <Gehe Zurück> Button gibt.

Gruß,
Severin

[Richard]

Hallo,

Ich hätte aber gerne die graphische Illusion, dass es einen <Formular senden> und einen <Gehe Zurück> Button gibt.

Dass es sich um ein Formular handelt, hättest du gleich sagen müssen. Dazu verwendest du <form action="...">.
Aber um das gesendete Formular zu verarbeiten, brauchst du serverseitige Sprachen. Mit Javascript ginge dass bedingt zwar auch, aber von den gesendeten Daten bekämest du aus Serversicht dann nichts mit.

Gruß aus MeckPomm

[Severin Kacianka]

Hallo,

Dass es sich um ein Formular handelt, hättest du gleich sagen müssen. Dazu verwendest du <form action="...">.

Das für mich implizit klar. Buttons haben (für mich) nur bei Formularen einen Sinn.
Das Problem liese sich, wie ich im Ausgangsposting geschrieben habe, mit einem Formular lösen, ich bin mir aber nicht sicher, ob dies die beste Lösung ist.

Das ganze sieht in etwa so aus:

  
<form method="get" action="foo.php">  
<!-- Diverse Formularfelder -->  
<input type="submit" value="Senden">  
<!-- jetzt hätt ich gerne einen link auf irgendwo.php, der wie ein Inputbutton aussieht -->  
<input type="button" value="Gehe zu Irgendwo!" name="irgendwo">  
</form>  

Wenn es keine einfache HTML Lösung gibt, wird mir nichts anderes übrig bleiben, als in foo.php zu erfragen, ob "irgendwo" gesetzt ist, und dementsprechend weiterzuleiten.

Gruß,
Severin

[Richard]

Hallo,

der Submit-Button führt automatisch das Script aus, das bei action=... zugewiesen wurde, deswegen heißt er Submit-Button. Du brauchst also keinen Link auf eine php-Datei.

Gruß aus MeckPomm

[Severin Kacianka]

Hallo,

der Submit-Button führt automatisch das Script aus, das bei action=... zugewiesen wurde, deswegen heißt er Submit-Button. Du brauchst also keinen Link auf eine php-Datei.

Ich _will_ aber einen Link auf eine PHP-Datei. Das Formular wird an die foo.php gesandt. Landen will ich aber in der irgendwo.php.
Momentan sehe ich zwei Möglichkeiten, die mir aber beide nich übermäßig gefallen:

1. Den "Irgendwo"-Button in ein "Dummyformular" verfrachten. Ist aber IMHO unnötiger Code.
2. Den Klick auf den "Irgendwo"-Button in der foo.php abfangen und auf die irgendwo.php weiterleiten. Ist ein unnötiger Redirect und unnötiger Code in der foo.php

Ich suche jetzt nach einer dritten Möglichkeit, und zwar einen Button (oder ein einem Button gleichsehendes Element) als ganz normalen Link zu verwenden.

Gruß,
Severin

[Sascha Knappe]

Hallo Severin,

dann mach doch einen Screenshot eines Button deiner Wahl und verlinke das Bild dann.
Das wäre jetzt das Einzige, was mir noch einfällt.

Schönen Gruß aus München

die knappschaft

[Severin Kacianka]

Hallo,

dann mach doch einen Screenshot eines Button deiner Wahl und verlinke das Bild dann.

Würde nichts bringen, da der Button in jedem Browser/Betriebssytem anders aussieht.

Gruß,
Severin

[Gunnar Bittersmann]

Hello out there!

Dann verwende Textlinks!

Ich hätte aber gerne die graphische Illusion, dass es einen <Formular senden> und einen <Gehe Zurück> Button gibt.

Was hindert dich daran, einen Textlink mit CSS so zu gestalten, dass er wie ein Button aussieht?

(Ob die Nutzer diese graphische Illusion auch gerne hätten oder doch eher verwirrt sind, sollte nochmal überdacht werden.)

See ya up the road,
Gunnar

[Severin Kacianka]

Hallo,

Was hindert dich daran, einen Textlink mit CSS so zu gestalten, dass er wie ein Button aussieht?

Fehlendes Wissen ;-) Wie gehe ich das am besten an? Kann man die Eigenschaften eines Button einfach "ererben"? Oder soll ich einfach so lange mit den Farben herumspielen, bis es passt? Was mache ich dann damit es plattformübergreifend gleich aussieht.

(Ob die Nutzer diese graphische Illusion auch gerne hätten oder doch eher verwirrt sind, sollte nochmal überdacht werden.)

In unserem Kontext wurde es für sinnvoll erachtet. Es dürfte viel verwirrender sein zwei völlig verschiedene Navigationselemente zu haben.

Gruß,
Severin

[Gunnar Bittersmann]

Hello out there!

Was hindert dich daran, einen Textlink mit CSS so zu gestalten, dass er wie ein Button aussieht?

Fehlendes Wissen ;-)

Hehe, du kennst doch background, border-color, border-width, border-style, color, font-size, padding, text-decoration?

Kann man die Eigenschaften eines Button einfach "ererben"?

Nein. Buttons sind Elemente des GUI des Betriebssystems.

Was mache ich dann damit es plattformübergreifend gleich aussieht.

Geht also nicht.

Was du machen könntest, ist einen Button per JavaScript ins Dokument setzen, der per onclick zum Ziel führt, und im noscript-Bereich einen Textlink, den du mit CSS einem Button annäherst. Passt dann natürlich nicht bei allen Nutzern ohne JavaScript. (1) Wie viele sind das? (2) Geht davon die Welt unter?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
  <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
    <title>TEST</title>  
    <style type="text/css">  
[code lang=css]      body {  
        font-size: 100.1%;  
      }  
      .Buttonlookalike {  
        background: silver;  
        border-color: gray;  
        border-width: 2px;  
        border-style: outset;  
        color: black;  
        font-size: .8em;  
        padding: .1em .8em;  
        text-decoration: none;

</style>
  </head>
  <body>
    <p>
      <script type="text/javascript">

      //[code lang=xml]<![CDATA[  
[code lang=javascript]        document.write("[code lang=html]<button onclick=\"[code lang=javascript]window.location='http://example.net'
~~~\">foo</button>[/code]");  
      //[/code]]]>[/code][/code]  
      </script>  
      <noscript>  
        <a class="Buttonlookalike" href="http://example.net">foo</a>  
      </noscript>  
    </p>  
  </body>  
</html>[/code]  
  
See ya up the road,  
Gunnar

-- 
“Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)

[Gunnar Bittersmann]

Hello out there!

Grmpf, die (X)HTML-Spec macht nicht immer Sinn, oder?

Die Verschachtelung <p><noscript><a/></noscript></p> ist nicht erlaubt.

So rum geht’s: <noscript><p><a/></p></noscript>. Im Script dann auch '<p>'und '</p>' um den Button setzen.

See ya up the road,
Gunnar

[Severin Kacianka]

Hallo,

Danke. Deine Lösung ist wunderbar. Keine Ahnung warum ich nicht an die noscript-Weiche gedacht habe!

Gruß,
Severin

[Michael]

Hallo,

Irgendwie scheine ich im Moment nicht so ganz klar denken zu können. Ich will einen Input-Button als Link verwenden:

<a href="http://www.example.com"><input type="button" value="Foo"></a>

Hi probiers mal damit:  
  
~~~html
  
<input type="button" name="button" value="HIER GIBST DU DEINEN ANGEZEIGTEN TEXT EIN" onClick="http://www.example.com">  

Dies sollte eigentlich funktionieren

[Severin Kacianka]

Hallo,

<input type="button" name="button" value="HIER GIBST DU DEINEN ANGEZEIGTEN TEXT EIN" onClick="http://www.example.com">

  
Du meinst  
~~~html
  
 <input type="button" name="button" value="HIER GIBST DU DEINEN ANGEZEIGTEN TEXT EIN" onclick="location.href='http://www.example.com'">  
 

und das funktioniert nur mit JavaScript, ist also nicht brauchbar.

Gruß,
Severin

[Der Martin]

Hallo Michael,

<input type="button" name="button" value="HIER GIBST DU DEINEN ANGEZEIGTEN TEXT EIN" onClick="http://www.example.com">

> Dies sollte eigentlich funktionieren  
  
nein, ganz sicher nicht. "http://www.example.com" ist nämlich keine gültige Javascript-Anweisung. Bitte schau dir deine eigenen Vorschläge nochmal kritisch an, bevor di sie abschickst.  
Außerdem gehört onclick in Javascript klein geschrieben, in XHTML auch, also warum nicht auch in HTML?  
  
So long,  
 Martin  

-- 
Ein guter Lehrer muss seinen Schülern beibringen können,  
eine Frage so zu stellen, dass auch der Lehrer lernen muss,  
um die Frage beantworten zu können.  
  (Hesiod, griech. Philosoph, um 700 v.Chr.)

[Ashura]

Hallo Severin.

Irgendwie scheine ich im Moment nicht so ganz klar denken zu können. Ich will einen Input-Button als Link verwenden:

Und die Optik allein genügt nicht?

Einen schönen Mittwoch noch.

Gruß, Ashura

[Severin Kacianka]

Hallo,

Und die Optik allein genügt nicht?

Würde mir reichen. Aber ich sehe im Moment nicht wie mir da dein Link helfen kann. Ich sehe ein Element, dass wie ein Submitbutton aussieht, und das ist der Submitbutton. Der "normale Textlink" sieht wie ein solcher aus.

Gruß,
Severin

[Ashura]

Hallo Severin.

Aber ich sehe im Moment nicht wie mir da dein Link helfen kann. Ich sehe ein Element, dass wie ein Submitbutton aussieht, und das ist der Submitbutton.

Welcher eigentlich¹ wie der Beispiellink darunter aussehen sollte.

Der "normale Textlink" sieht wie ein solcher aus.

Wenigstens etwas.

Einen schönen Mittwoch noch.

Gruß, Ashura

¹ Safari, Konqueror sowie Opera ausgenommen. Letzterer nur, sofern das Formatieren von Formularelementen unterbunden wurde.

[Severin Kacianka]

Hallo,

Welcher eigentlich¹ wie der Beispiellink darunter aussehen sollte.

Tut er zu meiner Verwunderung im Camino (dieser verwendet auch die Gecko-Engine) nicht. Mit einem "normalen" Firefox unter Linux kann ich das verhalten reproduzieren.

Gruß,
Severin

[Ashura]

Hallo Severin.

Welcher eigentlich¹ wie der Beispiellink darunter aussehen sollte.

Tut er zu meiner Verwunderung im Camino (dieser verwendet auch die Gecko-Engine) nicht.

Was eigentlich nicht verwundern sollte:

The native Cocoa interface and the beautifully-designed icons make Camino a very useful and elegant desktop citizen.

[caminobrowser.org]

Einen schönen Mittwoch noch.

Gruß, Ashura

[Severin Kacianka]

Hallo,

The native Cocoa interface and the beautifully-designed icons make Camino a very useful and elegant desktop citizen.
[caminobrowser.org]

Aber was hat das mit dem (CSS-)Verhalten von Formularelementen zu tun? Bei Cocoa geht es ja meines Wissens nach nur um die GUI-Element und deren Einpassung in den Rest des MacOS X GUIs.

Gruß,
Severin

[Ashura]

Hallo Severin.

Aber was hat das mit dem (CSS-)Verhalten von Formularelementen zu tun? Bei Cocoa geht es ja meines Wissens nach nur um die GUI-Element und deren Einpassung in den Rest des MacOS X GUIs.

Soweit ich dies bisher immer mitbekommen habe, lassen Programme, die Cocoa-Widgets zum Darstellen von GUI-Elementen verwenden, Umformatierungen an diesen nicht zu, um die Konsistenz in der GUI zu bewahren. Dies ist ja auch normalerweise vom User erwünscht.
Ich kannte dieses Verhalten bisher eigentlich nur von Safari, aber Camino scheint ebenso mit Formatierungen zu verfahren.

Einen schönen Mittwoch noch.

Gruß, Ashura

[at]

Hallo.

Soweit ich dies bisher immer mitbekommen habe, lassen Programme, die Cocoa-Widgets zum Darstellen von GUI-Elementen verwenden, Umformatierungen an diesen nicht zu, um die Konsistenz in der GUI zu bewahren. Dies ist ja auch normalerweise vom User erwünscht.
Ich kannte dieses Verhalten bisher eigentlich nur von Safari, aber Camino scheint ebenso mit Formatierungen zu verfahren.

Wer das nicht möchte, kann ja auf Firefox oder Mozilla ausweichen.
MfG, at

[Tim Tepaße]

Hallo,

Soweit ich dies bisher immer mitbekommen habe, lassen Programme, die Cocoa-Widgets zum Darstellen von GUI-Elementen verwenden, Umformatierungen an diesen nicht zu, um die Konsistenz in der GUI zu bewahren.

Das stimmt so. Wobei Safari langfristig plant mittels der Eigenschaft -khtml-appearance (Siehe CSS 3 UI) und eigener Werte mit CSS formatierbare Buttons einzuführen.

Dies ist ja auch normalerweise vom User erwünscht.

Ja, ich halte das für einen Fehler.

Wer das nicht möchte, kann ja auf Firefox oder Mozilla ausweichen.

Wenn ich das recht verstehe, ist für die Mac-Version von Firefox 3.0 geplant, die Cocoa Widgets von Camino zu benutzen.

Tim

[Ashura]

Hallo Tim.

Wobei Safari langfristig plant mittels der Eigenschaft -khtml-appearance (Siehe CSS 3 UI) und eigener Werte mit CSS formatierbare Buttons einzuführen.

Wenn man dies jetzt schon tun möchte, kann man doch an Stelle des input- das button-Element verwenden, oder? Zumindest war dieses in meinen letzten Safari-Tests (1.2 meine ich) formatierbar.

Dies ist ja auch normalerweise vom User erwünscht.

Ja, ich halte das für einen Fehler.

Seitens der Entwickler?

Einen schönen Sonntag noch.

Gruß, Ashura

[Tim Tepaße]

Hallo Ashura,

Wenn man dies jetzt schon tun möchte, kann man doch an Stelle des input- das button-Element verwenden, oder?

Ja, das geht.

Dies ist ja auch normalerweise vom User erwünscht.
Ja, ich halte das für einen Fehler.
Seitens der Entwickler?

Genau. (Ja, das war missverständlich ;)

Tim