J'essaie de mettre en place un code JavaScript pour le formulaire HTML5 qui sera responsable de la désactivation / activation du bouton jusqu'à ce que l'élément SELECT ne soit pas sélectionné. Voici les codes:
html: strong> p> et javascript strong>: p> function enableStartBtn() {
$('#startBtn').removeAttr('disabled');
}
function Test() {
var form = $('#courseForm');
var course = $('#coursetype', form).val();
if (course == '0') {
alert('Select the course first!');
} else if (course == '1') {
alert('CourseName 1 is selected!');
} else if (course == '2') {
alert('CourseName 2 is selected!');
} else if (course == '3') {
alert('This course is not implemented yet');
}
}
3 Réponses :
Utilisez access () code>
function enableStartBtn() {
$('#startBtn').prop('disabled',false); //<----to remove disable attr of the button
}
var courses = ['1','2']; // available courses
$('#coursetype').one('change', function() {
$('#startBtn').prop('disabled', false);
});
$('#startBtn').on('click', function() {
var val = $('#coursetype').val(),
msg = $.inArray(val, courses) != -1 ? 'CourseName '+val+' is selected!' : 'This course is not implemented yet';
alert(msg);
});
Agréable. Bien que peut-être qu'il ait logique de simplement mettre un attribut spécial data - * sur les cours "non implémentés". En outre, pourquoi utilisez-vous .One () ?
Pourquoi .One () ? Ne serait-il pas préférable d'activer / désactiver le bouton en fonction de la disponibilité des cours?
Une fois que le Select est modifié, le bouton est activé et vous ne pouvez plus sélectionner la première option, il n'est donc pas nécessaire d'exécuter le gestionnaire d'événements plus d'une fois.
Mais je ne voudrais pas que le bouton est activé si le cours n'était pas disponible. Je voudrais le désactiver si l'utilisateur sélectionne le cours 3. Je suppose que c'est un problème d'assurance-chômage.
@Derekhenderson - Je ferais probablement quelque chose comme ça également, mais vous n'avez pas besoin d'un bouton, vous feriez tout dans l'événement de changement, car il n'ya pas besoin d'un bouton de vous dire si le cours est disponible si le cours est disponible si Le bouton est désactivé lorsque le cours est indisponible? Quoi qu'il en soit, la question était de activer le bouton du premier changement de sélection et d'avoir le gestionnaire d'événements pendant plus d'une fois est un peu cherchée!
@adeneo, point pris. Bien sûr, aucune réponse n'est nécessaire, car le code de l'OP fonctionne très bien. ;)
@adeneo Avez-vous essayé votre solution avec JQuery Mobile 1.3.0?
@adeneo J'essaie d'inclure ce code à mon application Phonegap et pour la vue mobile, j'utilise JQuery Mobile 1.3.0 supposé que la version la plus récente de JQuery Mobile est sans bugs.
JQuery Mobile change le jeu entièrement, il possède ses propres manipulateurs d'événements et reconstruire Sélectionnez une liste déroulante avec des éléments UI personnalisés et d'autres choses, ce qui n'est même pas proche des réponses publiées ici.
Inclure dans la zone d'en-tête
Utilisez
.prop ('désactivé', false) pour activerÇa marche bien pour moi - jsfiddle.net/jmkra , bien que je suis d'accord, vous devez utiliser
accessoire pour celaVous pouvez également ajouter "désactivé" à votre marquage
Si vous essayez de le basculer étant désactivé (basé sur l'élément sélectionné), vous pouvez utiliser ceci: jsfiddle. Net / JMKRA / 2 . Il utilise un attribut spécial
data - * à la cible non mise en œuvre de cours, au lieu de stocker cela dans le JS@Lan Veuillez consulter
mettre à jour une partie de ma question.