web-dev-qa-db-fra.com

knockoutjs obtenez l'identifiant d'élément via un événement click

J'utilise Knockoutjs et j'ai actuellement quelque chose à mon avis qui ressemble à ceci:

<img id="myTab1" data-bind="click: pressedTab.bind($data, '#myTab1')" src="images/image1.png"></img>

Cela me permet d'obtenir l'identifiant d'élément dans mon modèle de vue:

pressedTab = function(tab){
    console.log("Element ID: " + tab);
}

Cela écrit:

ID d'élément: # myTab1

Cependant, il est trop répétitif pour envoyer le nom de l'ID IMG dans l'événement de clic. Existe-t-il un moyen d'envoyer l'ID IMG sans l'écrire explicitement?

21
bdev

Vous pouvez réellement avoir accès à l'objet événement via un gestionnaire de clic ko.

<button id="somebutton" data-bind="click: log">Click Me </button>

var ViewModel = function() {
    this.log = function(data, event) {
        console.log("you clicked " + event.target.id);
    }
};
ko.applyBindings(new ViewModel());

http://jsfiddle.net/madcapnmckay/e8jpt/

J'espère que cela t'aides.

55
madcapnmckay

La réponse de Madcapnmckay n'est pas complètement correcte. Vous pouvez mieux utiliser actuelTarget: il retournera l'élément lié d'origine au lieu d'un élément enfant, quand c'est-à-dire que vous avez une div avec des éléments imbriqués.

Voir ceci question

Mise à jour

Comme @ryan mentionné - Event.CurrentTarget n'est pas disponible pour IE8. Pour <= IE8 Soutien que vous pouvez utiliser:

var target = (event.currentTarget) ? event.currentTarget : event.srcElement;
13
Dirk Boer

Liaison HTML

 <input type="checkbox" data-bind="attr:{id: $data.Id , Qref: '3177'} , click: $root.answerClick">&nbsp;&nbsp;&nbsp;<span data-bind="text: $data.Text , attr:{id: $data.Id}"></span>

code JS

answerClick: function(c, event){
        var element = event.target;
        var qref = element.getAttribute('Qref');
        var click_id = element.id;
        return true;
    }
1
San Jaisy