내 프로젝트에서 jsPlumb 라이브러리를 사용하고 있으며 연결된 경우 끝점 이미지를 변경하는 기능이 있습니다. 페이지가로드되고 모든 것이 제대로 작동하면 호출하지만 연결 이벤트에서 호출하면 아무 일도 발생하지 않습니다.이미지를 jsPlumb 끝점으로 설정할 수 없습니다.
function changeEndpointImage(){
var elem = $('.tableBody'); //These are my connectable elements
for(var i=0;i<elem.length;i++)
{
var eps=jsPlumb.getEndpoints($(elem[i])); //Getting endpoints for each of the connectable elements
for(var j=0;j<eps.length;j++)
{
if(eps[j].connections.length!=0) //Checking if any of them have connections
eps[j].setImage("images/styled_radiobutton.png"); //Setting another image
}
}
}
jsPlumb.bind("connection", function(connection) {
changeEndpointImage();
//I have also tried this method commented below, but nothing.
//connection.sourceEndpoint.setImage("images/styled_radiobutton.png");
//connection.targetEndpoint.setImage("images/styled_radiobutton.png");
});
나는 또한 연결이 분리되는 경우 첫번째보기로 다시 엔드 포인트의 이미지를 변경하기 위해 노력하고있어,하지만이 경우, 소스 엔드 포인트가 변경됩니다은, 대상이 동일하게 유지 : 여기 내 코드입니다
jsPlumb.bind("connectionDetached", function(connection) {
connection.targetEndpoint.setImage("images/rsz_styled_radiobutton.png");
connection.sourceEndpoint.setImage("images/rsz_styled_radiobutton.png");
});
무엇이 누락 되었습니까? 아니면이 문제를 어떻게 해결할 수 있습니까?
편집 : 여기 jsfiddle입니다 : 우측 DIV에
https://jsfiddle.net/vaxobasilidze/cg3hkde7/
드래그 몇 가지 항목을 눌러 "새 링크 추가"및 연결을 분리 연결하려고합니다. 엔드 포인트가 변경되지 않음을 알 수 있습니다.