Question

当我有一个元素时，我会在鼠标结束时添加一些边框，以指示要点击哪个项目：

// cy an instance of a cytoscape object
cy.on('tap',function(event){
      var evtTarget = event.target;

      if( evtTarget === cy ){
        console.log('tap on background');
        $("#nodes").hide();
        $("#no_selected").show();
      } else {
        console.log("Display Info")
        displayInfo(evtTarget._private.data.properties);
      }
    }).on('mouseover',function(event){
      var evtTarget = event.target;

      if( evtTarget !== cy ){
        console.log("Mouse Over");
        evtTarget.style('border-width','2px').style('border-color',"#AF0000");
      }
    }).on('mouseout',function(event){
      var evtTarget = event.target;
      if( evtTarget !== cy ){
        console.log("Fired");
        evtTarget.style('border-width',null).style('border-color',null);
      }
    });

所以我想要实现的是当发生mouseout事件以从节点中删除边界时。到目前为止，我无法弄清楚如何做到这一点和上面的代码没有发生。您是否知道如何从节点或边缘删除style属性？

Answer 1

在您的情况下，只需在border-width事件发生时0px设置mouseout：

// In your case just chain it with other `on methods`
cy.on('mouseout',function(event){
      var evtTarget = event.target;
      if( evtTarget !== cy ){
        console.log("Fired");
        evtTarget.style('border-width','0px);
      }
    });

如我所见，您只需要将属性值重置为您在style部分为边缘或节点设置的默认值。有时只是设置一个默认值（例如，对于大小为0px就足够了以便不显示）可以为最终用户带来所需的效果。

事件发生时，Cytoscape从元素中删除样式

1 个答案: