2012-06-22 5 views
21

Я использую knockoutjs и я в настоящее время есть что-то, на мой взгляд, что выглядит следующим образом:knockoutjs получить идентификатор элемента через событие щелчка

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

Это позволяет мне получить идентификатор элемента в моей модели представления:

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

Об этом пишет:

элемент ID: # myTab1

Однако, это слишком повторяющееся, чтобы отправить имя идентификатора img в событие click. Есть ли способ отправить идентификатор img без явного переписывания его?

+0

Ниже ссылка работает для меня с нокаута связывания Http: // StackOverflow .com/вопросы/31513689/knockout-to-get-the-attribute-value-onclick-function/31514589 # 31514589 –

ответ

53

Фактически вы можете получить доступ к объекту события с помощью обработчика кликов 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/

Надеется, что это помогает.

+0

Это именно то, что мне нужно. Большое спасибо! – bdev

+0

спасибо. это спасло меня от некоторых вытягиваний волос – solefald

+0

пропустил это в документах с нокаутом. Спасибо – geedubb

13

Ответ madcapnmckay не совсем корректен. Вы можете лучше использовать currentTarget: он вернет исходный связанный элемент вместо дочернего элемента, когда у вас есть div с вложенными элементами в нем.

Смотрите эту question

Update

Как уже упоминалось @Ryan - event.currentTarget не доступен для IE8. Для < = поддержки IE8 вы можете использовать:

var target = (event.currentTarget) ? event.currentTarget : event.srcElement; 
+0

Согласен. vm.yourFn = функция (данные, события) { \t \t \t \t \t \t var $ target = $ (event.currentTarget) ... отлично работает. – rball

+1

Обратите внимание, что если вам необходимо поддерживать IE <9, currentTarget недоступен для этих версий. – Ryan

+0

Вы правы. Я обновил ответ! –

1

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> 

JS код

answerClick: function(c, event){ 
     var element = event.target; 
     var qref = element.getAttribute('Qref'); 
     var click_id = element.id; 
     return true; 
    } 
Смежные вопросы