Quelle est la façon correcte de le désactiver un input type=“image” à l'aide de jquery?

Avec jQuery, je vais essayer de désactiver un champ de saisie comme ceci:

<input id="submit" type="image" src="submit.jpg">

Ce que je voudrais faire est de désactiver le bouton et changer l'image avec une image différente (submitGreyed.jpg) visuellement informer que le bouton est désactivé.

Avec la ligne suivante-je désactiver le bouton:

JQuery("#submit").attr('disabled','true');

puis-je changer l'image avec:

JQuery("#submit").attr('src','submitGreyed.jpg');

et une fois désactivée-je soumettre le formulaire avec:

JQuery("#form").submit();

La deuxième ligne a certains comportements étranges; fonctionne parfois et parfois ne l'est pas.

Quand il fonctionne, le bouton est désactivé, l'image a changé et le formulaire est soumis;
quand il ne fonctionne pas, le bouton est désactivé, le formulaire est soumis, mais l'image n'est pas modifiée.

Comment puis-je résoudre ce problème?

De quelle manière faut-il parfois de ne pas travailler? Voulez-vous dire qu'il rompt dans certains navigateurs?
oui, il ne fonctionne pas dans firefox 3.5.7 et safari. Une fois l'image apparaît pour la première fois, puis il commence à travailler. Mais, lorsque vous fermez et rouvrez le navigateur, il ne fonctionne pas encore.
Vos citations sont déséquilibrés entre les doubles et les guillemets simples. #formulaire est absent de la fin de citation entièrement
Vous avez raison, mais c'était juste une faute de frappe.Le code Source est correcte.
Avez-vous essayé de ne pas soumettre le formulaire? Si c'est quelque chose de préchargement permettra de résoudre, alors il devrait fonctionner à chaque fois si vous commentez la soumission de la partie pour tester un peu.

OriginalL'auteur systempuntoout | 2010-02-06

  1. 9

    Ce n'est pas la réponse à votre question exactement, mais j'espère que cela aide:

    Tout d'abord, il convient de disabled="disabled" donc l'utiliser:

    jQuery("#submit").attr('disabled','disabled');

    Et je ne suis pas sûr de ce que votre grisé bouton ressemble, mais vous pouvez essayer en utilisant simplement l'opacité:

    jQuery("#submit").attr('disabled','disabled').css('opacity',0.5);

    Mise à jour je n'arrivais pas à reproduire le problème, donc, voici ma suggestion:

    Utiliser un chemin absolu de l'image à la place d'un parent, et de définir à la fois les attributs en même temps (même Si le réglage, l'un après l'autre n'a pas changer mon test):

    jQuery("#submit").attr({
   disabled: 'disabled',
   src:      '/images/submitGreyed.jpg'
});

    Étant donné que dans mon test j'ai utilisé un chemin d'accès complet, qui pourraient avoir une incidence sur un peu.

    à voir une démo ici

    Disable: true fonctionne également via jQuerry. Je ne suis pas sûr si c'est le navigateur ou jQuery qui l'accepte. Probablement le navigateur de voir l'attribut avec une valeur quelconque.

    OriginalL'auteur Doug Neiner