|
|||
jQuery & spinner
Hi ich möchte eine Box mittels spinner in seiner Größe verändern.
Edit fiddle - JSFiddle Es sind ein Fehler da. Die spinner werden doppelt angezeigt. Was mache ich falsch? Grüße Geändert von gabischatz (05.02.2014 um 21:11 Uhr) |
Sponsored Links |
|
||||
Wo wird da was doppelt angezeigt?
Anbei eine Lösung die da mal besser funktioniert. API durchlesen. Auch wenn die auf Englisch ist. Edit fiddle - JSFiddle
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato... All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege www.richard-thiel.de | Müssen Websiten überall gleich ausschauen? |
Sponsored Links |
|
||||
Ich meine in allen Browsern, die type="number" nicht kennen, sieht mann es auch nicht (aktuelle ff und IE).
in Chrome, Safari und Opera sieht mann das Problem. Guck mal mit ff oder IE hier: HTML5 - Inputs
__________________
MfG Jens Geändert von plastiko (06.02.2014 um 01:55 Uhr) |
|
||||
Zitat:
Aber auch hier hat mein Rat "API lesen" den totalen Sieg errungen Zitat:
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato... All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege www.richard-thiel.de | Müssen Websiten überall gleich ausschauen? |
|
|||
Hi, danke für eure Antwort
Ich habe da noch eine Frage Wie kann ich denn das ausführen, HTML-Code:
$(function() { function boxsize(){ $('#div-test').css({ width: $('#width').val(), height: $('#height').val(), }); } $('input[type=number]').spinner({ min : 0, max : 1000, change: boxsize, stop: boxsize, spin: boxsize }); $( 'input[type=number]' ).click(function() { boxsize(); }); }); HTML-Code:
<input id="spinner">
MfG |
|
||||
$('input') oder $('#spinner') oder $('input#spinner')
Das wären allein schon drei Möglichkeiten.
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato... All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege www.richard-thiel.de | Müssen Websiten überall gleich ausschauen? |
|
|||
Hi Thielo, $('input') geht schon mal gar nicht. Hier mal eine fiktive Form.
HTML-Code:
<form action="input_radio.htm"> <p>Kreuzen Sie die gewünschten Zutaten an:</p> <p> <input type="checkbox" name="zutat" value="salami"> Salami<br> <input type="checkbox" name="zutat" value="pilze"> Pilze<br> <input type="checkbox" name="zutat" value="sardellen"> Sardellen </p> <p>Geben Sie Ihre Zahlungsweise an:</p> <p> <input type="radio" name="Zahlmethode" value="Mastercard"> Mastercard<br> <input type="radio" name="Zahlmethode" value="Visa"> Visa<br> <input type="radio" name="Zahlmethode" value="AmericanExpress"> American Express </p> <p> <label for="width">width:</label> <input name="width" id="width" value="100" style="width: 50px;" /> <label for="min-width">min-width:</label> <input name="min-width" id="mmin-in-width" value="100" style="width: 50px;" /> <label for="max-width">max-width:</label> <input name="max-width" id="max-width" value="100" style="width: 50px;" /> </p> <p> <label for="height">height:</label> <input name="height" id="height" value="100" style="width: 50px;" /> <label for="min-height">min-height:</label> <input name="min-height" id="min-height" value="100" style="width: 50px;" /> <label for="max-height">max-height:</label> <input name="max-height" id="max-height" value="100" style="width: 50px;" /></p> <p> <input type="hidden" name="UserBrowser" value=""> Ihr Kommentar:<br> <textarea name="UserKommentar" rows="2" cols="20"></textarea><br> <input type="submit" value="senden"><br> </p> <input type="button" /> </form> HTML-Code:
$(function() { function boxsize(){ $('#div-test').css({ width: $('#width').val(), height: $('#height').val(), }); } $('input[type=number]').spinner({ min : 0, max : 1000, change: boxsize, stop: boxsize, spin: boxsize }); $( 'input[type=number]' ).click(function() { boxsize(); }); }); Alternative $('#width,#min-width,#max-width,#height,#min-height,#max-height') Gibt es keine alternative mit css die Standard Anzeige auszublenden? Grüße |
|
||||
Zitat:
Du könntest all die Spinner Elemente clonen und einen anderen Typ Feld dann beim Clone nutzen. Das wäre aber erst in Schritt Zwei empfehlenswert. Dafür mangelt es bei dir leider noch zu sehr am Rest. Bau dein Markup doch einfach mal etwas semantischer auf. Kein inline-CSS, ein <button> sollte nicht leer sein, sondern Inhalt enthalten (sonst kann man auch gleich <input type="submit" /> nehmen. Du kannst Klassen, IDs und andere Selektoren nehmen die du verwendest. man könnte zum Beispiel die Spinner alle über ein data-Attribut nutzen. HTML-Code:
<input data-type="spinner" type="text" value="" />
Noch ein "Nachtrag" zu dem Clonen. Du hast scheinbar gemerkt, das es da Probleme gibt und ich habe "gemerkt" das es einige Feld-Typen nicht gibt. Meine Meinung zu sowas: In Fällen, in denen komplette Elemente nicht in einem Browser existieren. Wird dieses Element nicht genutzt oder dementsprechend "ersetzt".
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato... All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege www.richard-thiel.de | Müssen Websiten überall gleich ausschauen? |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Das jQuery UI Accordion Plugin ohne jquery kenntnisse nutzen? | papalapap | Javascript & Ajax | 8 | 13.08.2012 23:00 |
jquery beim klick html seite öffnen?! | dimo21 | Javascript & Ajax | 3 | 21.09.2011 21:20 |
jQuery (coda slider) und prototype (Lightbox) konflikt | computernerd | Javascript & Ajax | 3 | 21.09.2011 20:04 |
Hover Problem bei JQuery | charlie | Javascript & Ajax | 2 | 03.01.2009 08:01 |
JQuery + Wordpress | VoinG | Javascript & Ajax | 0 | 29.12.2008 17:03 |