2013-06-14 7 views
0

У меня есть набор сгруппированных форм svg, которые имеют класс & отдельных идентификаторов. У меня есть функция onclick на этих фигурах, которая, в свою очередь, запускает другую функцию (фильтр), которая отфильтровывает массивы внутри моего холста. У меня также есть двойной щелчок, чтобы вернуть фильтры.Отключить/Включить кнопки при нажатии

Однако, когда я нажимаю на одну из фигур, я хочу, чтобы остальные были отключены, пока я не дважды щелкнул фигуру, которую я только что нажал. Я видел много примеров, но, кажется, не работать Heres работать у меня до сих пор:

function filter (d) { 


    if (d.s =='triangle') 
    {d3.selectAll(".nodes").filter(function(d) {return d.categ === 'High' || d.categ === 'Low'}).transition().style("opacity", 0).style("display", "none"); 
     d3.selectAll("#High").on('click',function() { d3.event.stopPropagation(); }); } 

else if (d.s =='cross') 
    {return d3.selectAll(".nodes").filter(function(d) {return d.categ === 'Medium' || d.categ === 'Low'}).transition().style("opacity", 0).style("display", "none");} 

else {return d3.selectAll(".nodes").filter(function(d) {return d.categ === 'Medium' || d.categ === 'High'}).transition().style("opacity", 0).style("display", "none");} 

    } 



function antifilter (d) { 


     d3.selectAll(".nodes").transition().style("opacity", 1).style("display", "block") 


} 

Я также попытался использовать

 .on('click',null) 

И

 document.getElementById("High").onclick = function() { return false; } 

но не повезло. Любая помощь будет замечательной! Так что есть способ начать щелчок мыши еще раз, когда я дважды кликнуть. Не могу найти противоположность stopPropagation для сброса моих фильтров.

http://jsfiddle.net/yPqqx/

+0

не знаком с d3. Должен ли атрибут быть включен? – uotonyh

+0

Нет, похоже, что использование stop.propagation отлично работает. Но есть ли противоположность этому, так что при двойном щелчке все возвращается к норме? – Jose

+0

Попробуйте настроить демонстрационную скрипту на jsfiddle.net. Она может многое помочь с визуализацией вашей проблемы и быстрее получить решение. –

ответ

0

Я просто попытался сценарий о вашем вопросе, посмотреть на

HTML

<span id="res">0</span> 
<a href="javascript:void(0);" id="High">Link</a><br> 
<a href="javascript:void(0);" id="Enable">Enable</a><br> 
<a href="javascript:void(0);" id="Disable">Disable</a> 

JQuery

function increase(){ 
    $("#res").text(parseInt($("#res").text()) + 1); 
} 
$("#High").on("click",increase); 
//Enable 
$(document).on("click","#Enable",function(){ 
    $("#High").on("click",increase); 
}); 
//Disable 
$(document).on("click","#Disable",function(){ 
    $("#High").off(); 
}); 

и jsFiddle

+0

Эй, спасибо за ответ. Это пример того, что я пытаюсь сделать сейчас ... http://jsfiddle.net/yPqqx/ – Jose

Смежные вопросы