comment rendre une division cliquable ?

Question

<div><span>shanghai</span><span>male</span></div>

Pour une division comme ci-dessus, lorsque la souris est dessus, elle doit devenir curseur:pointeur, et lorsqu'elle est cliquée, elle déclenche un

fonction javascript, comment faire ce travail ?

EDITAR et comment changer la couleur de fond de la division lorsque la souris est activée ?

EDIT ENCORE Comment faire en sorte que le premier span ait une largeur de 120px ? Il semble que cela ne fonctionne pas dans Firefox.

Answer 1

Ajouter le en cliquant sur attribut

<div onclick="myFunction( event );"><span>shanghai</span><span>male</span></div>

Pour faire changer le curseur, utilisez La règle du curseur de css .

div[onclick] {
  cursor: pointer;
}

Le sélecteur utilise un sélecteur d'attributs qui ne fonctionne pas dans certaines versions d'IE. Si vous voulez supporter ces versions, ajoutez une classe à votre div.

Answer 2

Comme vous avez mis à jour votre question, voici un exemple obtrustif :

window.onload = function()
{
    var div = document.getElementById("mydiv");

    div.style.cursor = 'pointer';
    div.onmouseover = function()
    {
        div.style.background = "#ff00ff";
    };
}

Answer 3

<div style="cursor: pointer;" onclick="theFunction()" onmouseover="this.style.background='red'" onmouseout="this.style.background=''" ><span>shanghai</span><span>male</span></div>

Cela changera également la couleur de l'arrière-plan

Answer 4

Si ce div est une fonction, je suggère d'utiliser cursor:pointer dans votre style comme style="cursor:pointer" et vous pouvez utiliser la fonction onclick.

comme ceci

<div onclick="myfunction()" style="cursor:pointer"></div>

mais je vous suggère d'utiliser un framework JS comme jquery ou extjs