直到功能完成后，Javascript禁用点击事件？

目前我的代码是这样的。就像这个功能所做的那样，单击时，它会根据满足的条件将SVG元素转换为某种颜色（在本例中为sting.state.mi === 'und'）。直到功能完成后，Javascript禁用点击事件？

单击之后，它所链接的SVG项目将更改颜色，如m[geography.id]中所示。但是，如果我将这个按钮垃圾邮件的次数足够多，那么我可以看到错误的颜色。

我想避免用户发送我的点击按钮。使用datamap.svg.select('.datamaps-subunit.MI).disabled = true并不是真的。但是，我希望它能够得到重点。

以下是我的代码。

datamap.svg.select('.datamaps-subunit.MI').on('click', function(geography) { 
var m = {}; 

if (sting.state.mi === 'und'){ 
    datamap.svg.select('.datamaps-subunit.MI').disabled = true;  
    sting.setState({trumpnums: sting.state.trumpnums + 12}); 
    sting.setState({mi: 'right'}); 
    m[geography.id] = 'tomato'; 
    datamap.svg.select('.datamaps-subunit.MI').disabled = false; 
    } 
});

本例使用Reactjs和Datamaps，虽然我无法想象那是完全相关的。

来源

2016-08-04 Jason Chen

一个简单的标志应该做的伎俩：

var waiting = false; 
datamap.svg.select('.datamaps-subunit.MI').on('click', function(geography) { 
    // only run the logic if it isn't already being run 
    if (!waiting) { 
     waiting = true; 
     var m = {}; 

     if (sting.state.mi === 'und'){ 
      datamap.svg.select('.datamaps-subunit.MI').disabled = true;  
      sting.setState({trumpnums: sting.state.trumpnums + 12}); 
      sting.setState({mi: 'right'}); 
      m[geography.id] = 'tomato'; 
      datamap.svg.select('.datamaps-subunit.MI').disabled = false; 
      waiting = false; 
     } 
    } 
});

另外，还可以设置所有的状态，在一次和setState将调用提供的回调一旦完成：

if (sting.state.mi === 'und'){ 
    sting.setState({ 
    trumpnums: sting.state.trumpnums + 12, 
    mi: 'right' 
    }, function() { 
    m[geography.id] = 'tomato'; 
    waiting = false; 
    }); 
}

来源

2016-08-04 17:08:00

直到功能完成后，Javascript禁用点击事件？

回答

相关问题