input type = image – onclick (), attiverà il suo evento, ma non agirà correttamente sulla funzione in jquery

(Penso che questo potrebbe essere due post – 2 domande .. quindi se vuoi commentare … li separerò)

il problema principale è acually:

come posso impostare uno sfondo immagine per un pulsante … facile e corretto?

Penso che ora potrei essere sicuro di questi fatti:

dato che ho avuto un “piccolo” problema con l’impostazione dell’immagine come sfondo del pulsante, … ho pensato, ok, se è difficile impostare con image-background, perché no, basta impostare l’evento onclick su un !

e avevo ragione (… quasi), perché sì, impostare click-event sul tipo di image è facile, anche, per impostare src ..instead di background-image per button … almeno per me, lo è.

il problema è, nel progetto corrente), usando una dialog - ok, cancel jQuery-UI dialog - ok, cancel ,

sembra che il problema sia rappresentato dal tipo di immagine, Postback (?!), quindi il dialogo scompare

e il pulsante non causa questo difetto.

Ho provato a eseguirne il debug con un break-point, in vs2010 ed è tutto ok con un evento click in quanto entrambi arrivano al punto di “ingresso funzione” … quindi con il tipo di immagine … potrei solo prendere appunti, come potevo vedere il <- Back button , passare da disabled per essere cliccabile, quindi significa che ha fatto postback.

e ciò non accade con un pulsante, mentre si passa il mouse sopra il pulsante non è successo nulla, e con l’immagine si potrebbe vedere un link nella barra di stato.

quindi c’è una differenza (una reale), tra un pulsante – “converti” in un’immagine, che un’immagine trasformata in un “pulsante” (allegandolo ad un evento Click() ),

quindi, quello che vorrei sapere, è: (solo se mi è permesso questa volta di utilizzare questo post per entrambe le risposte che riguardano realmente)

perchè l’immagine postback? potrei disabilitare questa azione? … non è un controllo del server. è qualcosa che dovresti sapere, e supponiamo che accada?

di nuovo se è fuori tema vorrei spostare questa domanda, e ho bisogno di un modo propper per impostare l’immagine di sfondo per un pulsante a meno che non ci sia una soluzione per il suo comportamento.

Non sono sicuro del motivo per cui l’elemento di input del tipo di immagine si comporta in modo diverso rispetto al tipo di pulsante, ma se fossi in te eviterei tutto insieme. Se stai cercando di personalizzare il tuo pulsante (che sembra che tu sia) ti suggerirei di utilizzare un div e controllare l’interazione dell’utente tramite jquery / javascript.

Demo: http://jsfiddle.net/jrb9249/BvTD5/

HTML:

  

Click Me!

Javascript:

 $('.div_button').click(function(){ alert('Run a postback via JS'); }); 

CSS:

 .div_button { border: solid 1px gray; width:80px; height:25px; background:#A3A3A3; text-align:center; margin:0 auto; margin-top:50px; } .div_button:hover { border: solid 1px blue; background:#A1A1A1; cursor:pointer; } 

Per aggiungere alcuni tocchi finali per completare l’aspetto del pulsante, basta aggiungere alcuni angoli arrotondati utilizzando il plugin angoli arrotondati jquery trovato qui . E se hai bisogno di fare un post con questo controllo (non sembra un controllo asp.net quindi non penso che sia quello che stai facendo) puoi usare la tecnica __Postback qui descritta.

Spero che questo aiuti, buona fortuna con il tuo sito.


Aggiornamento: da questo post ho iniziato a racchiudere i miei tag div all’interno di un tag per creare un hyperlink dal div. Puoi quindi applicare eventi di clic personalizzati all’elemento e avere un maggiore controllo sul pulsante che hai creato.