web-dev-qa-db-fra.com

En cliquant sur le bouton 'Ajouter au panier' désactivé

J'ai un bouton dans Woocommerce, qui doit être ajouté au panier. Il sera ajouté au panier que si les options pertinentes ont déjà été choisies. Jusque-là, le bouton est désactivé:

<button class="single_add_to_cart_button button alt" type="submit"
    disabled="disabled" 
    title="Select product options before adding this product to your cart."
    >Add to cart</button>

Par défaut - rien ne se produit lorsque l'on clique sur la button, car elle est désactivée, mais cela peut être déroutant pour un utilisateur vu qu'il n'y a aucun retour.

Ce que je veux faire, c’est d’avoir le popup title comme alerte quand cela se produit.

J'ai essayé la fonction jQuery suivante, ajoutée à l'option de script personnalisé du thème:

(function($) {
  "use strict";
  jQuery("button.single_add_to_cart_button[type=submit]").click(function(){
    var isDisabled = jQuery(this).is(':disabled');
    if (isDisabled){
      alert(jQuery("button.single_add_to_cart_button[type=submit]").attr('title'));
    }
  });
})(jQuery);

Mais rien n'est déclenché et il n'y a pas d'alerte. J'ai également essayé de remplacer la jQuery par $, mais cela ne fonctionne pas.

UPDATEa également essayé ceci:

  jQuery(".variations_button").on("button.single_add_to_cart_button[type=submit]","click", function(){
        var isDisabled = jQuery(this).is(':disabled');
    if (isDisabled){
      alert(jQuery("button.single_add_to_cart_button[type=submit]").attr('title'));
    }
  });
jquerywoocommerce
1
kneidels

Les éléments désactivés ne déclenchent pas les événements de souris, vous devez donc envelopper une div autour du bouton et saisir l'événement.

3
Sören Wrede