Knockout.js 동적 링크가 클릭 연결되지 않음

knockout js를 사용하는 새 프로젝트를 진행 중입니다. 관찰 가능한 배열을 채우는 형태로 입력 된 이미지와 정보를 표시하는 작은 테이블을 설치했습니다. 이미지에 앵커 (링크) 태그가있는 경우 KO 데이터 바인딩을 통해 href를 먹입니다. 아래를 참조하십시오. Knockout.js 동적 링크가 클릭 연결되지 않음

<a data-bind="attr: {href: imgUrl}" target="_blank"><img class="imgThumb" data-bind="attr: {src: imgUrl}"/></a>

예상대로이 디스플레이의 모든

그러나 링크 중 어느 것도 실제로 이미지 위치로 클릭하지 않습니다.

는 배열 항목은 다음과 같습니다

col1: 'Bert', col2: 'Muppet', col3: 'Sesame Street', imgUrl: 'http://images3.wikia.nocookie.net/__cb20101210195428/muppet/images/4/40/Bert1970s.jpg'

렌더링 된 HTML은 다음과 같습니다 다시 한번

<a data-bind="attr: {href: imgUrl}}" target="_blank" href="http://images3.wikia.nocookie.net/__cb20101210195428/muppet/images/4/40/Bert1970s.jpg"><img class="imgThumb" data-bind="attr: {src: imgUrl}" src="http://images3.wikia.nocookie.net/__cb20101210195428/muppet/images/4/40/Bert1970s.jpg"></a>

내 링크를 수행해도 문제가 해결되지 않는, 그들은 통해 클릭하지 내가 기대하는대로 이미지 위치에. 누구든지 여기서 나를 도울 수 있고 제가 빠진 것을 지적 할 수 있습니까? 또한 참고로, 나는 click: function(){ return true; }도 추가하려고 시도했는데, 그 역시 도움이되지 못했습니다. http://dev.voidbase.com/working.html

출처

2013-08-24 JSpell

매우 이상합니다. 그게 효과가있다. @PWKad, 브라우저는 앵커에서 자동으로 href를 처리합니다. href가 설정되면 자바 스크립트가 필요하지 않습니다. 클릭을 방해하는 것을 볼 수 없습니다. JSpell, [피들] (http://jsfiddle.net)에서 이것을 재현 할 수 있습니까? – FakeRainBrigand

당신은 또한

과 올바른 궤도에있다가, 참고로, 나는뿐만 아니라 click: function(){ return true; }을 추가하는 시도했으며, 그 중 하나가 도움이되지 않았다 : 사전 및 데모 감사는 여기에서 찾을 수 있습니다 .
<a target="_blank" data-bind="attr: {href: imgUrl}, 
     click: function() { return true;}, clickBubble: false"> 
    <img class="imgThumb" data-bind="attr: {src: imgUrl}"/> 
</a> 
데모 JSFiddle 다음 click 이벤트가 여전히 버블 그래서 당신이 clickBubble: false 옵션합니다 (documentation도에서 참조)를 사용해야하므로

는 그러나 자신의 click: function(){ return true; }는 충분하지 않습니다.

그런데 본문 요소의 클릭 바인딩은 클릭 이벤트를 "도용"합니다 : <body style="padding-top: 100px;" data-bind="click: modalKiller">. 따라서 modalKiller 처리기에서 true을 반환하면 문제가 해결됩니다.

출처

2013-08-24 08:01:20 nemesv

이것은 링크를위한 많은 작업처럼 보입니다. 그러나 그것은 나를 위해 일했다 - 감사합니다! – Aaron

Knockout.js 동적 링크가 클릭 연결되지 않음

답변

관련 문제