Comment rendre une image cliquable et d'exécuter la fonction?

Je suis simplement en train d'essayer de faire une image cliquable et d'exécuter la fonction.
Voici mon code:

<button class="button button-stable button-clear" on-click="myFunction()">
<img src="image.png" >
</button>

Mais la fonction ne s'exécute pas sur l'événement click.

  • Le bon attribut est onclick. Ou, dans angulaire, ng-click, je suppose.
  • Si vous marquez un de la réponse Acceptée, vous recevrez deux autres points de Réputation pour vous-même.
InformationsquelleAutor user2985035 | 2016-02-17
  1. 4

    Angulaire vous devez utiliser ng-click.

    essayer ng-click="myFunction()"

    InformationsquelleAutor Mike Feltman
  2. 2

    vous pouvez faire

    <img src="image.png" ng-click="myFunction()" />
    InformationsquelleAutor Sha Alibhai
  3. 0

    essayer de mettre un ng-click dans <img>

    Par exemple

    <img class="button " ng-src="{{i.imagem}}" ng-click="myFunction($index)"></img>
    InformationsquelleAutor AdsHan
  4. -1

    Vous n'avez pas à. Avec un peu plus de balisage, vous pouvez le faire.

    • Envelopper l'image de l'étiquette
    • ensemble pour à un bouton caché id
    • exécuter js sur le bouton cliquez sur

    Cela va être un plus accessible solution pour personnes handicapées.
    Utiliser ce code html.

    <!--html-->
<label for="image-click">
  <img src="http://lorempixel.com/100/100" alt="" />
</label>
<button id="image-click" 
  onclick="myFunction()" 
  class="visuallyhidden">
  Click to run image
</button>

    Et ajouter un peu de css.

    //css
.visuallyhidden {
  position: absolute; 
  overflow: hidden; 
  clip: rect(0 0 0 0); 
  height: 1px; width: 1px; 
  margin: -1px; padding: 0; border: 0; 
}
label {
  cursor: pointer;
}

    Ici est un codepen qui montre comment - http://codepen.io/bitlinguist/pen/bEJvoz

    Vous pouvez facilement adopter cette approche angulaire directives.

    • Trop complexe solution à ce problème. Il utilise Angulaire. Angulaire a une fonctionnalité intégrée pour cela. L'ajout de CSS, Jquery, etc. est exagéré.
    • Assez juste, mais vous devriez le lire et vous verrez que le jQuery est uniquement pour la fonction à écrire pour le corps. Simplifié à l'illustration. Tous vous avez besoin est le balisage et les feuilles de style css. Visuallyhidden est communément partie de sass cadres, et le pointeur est généralement mis sur les étiquettes. étiquette["par"] peut être utilisé pour spécifier. Et le balisage est accessible. Je ne suis pas sûr, cependant si une balise alt est assez accessible pour les images cliquables ou si angulaire est d'utiliser quelque chose pour résoudre ce problème. De toute façon, merci pour les commentaires. Malade de mise à jour de la réponse sans jquery.
    InformationsquelleAutor dewwwald