D3:如何同时设置“click”事件和“dblclick”事件?

时间:2013-08-19 05:55:26

标签: javascript event-handling d3.js double-click

我已经将click事件切换到节点,我也希望将dbclick事件切换到它。但是,当我点击它时,它只触发click事件。

那么如何同时设置两个事件?

5 个答案:

答案 0 :(得分:15)

你必须进行“自己的”双击检测

这样的事情可以起作用:

var clickedOnce = false;
var timer;

$("#test").bind("click", function(){
    if (clickedOnce) {
        run_on_double_click();
    } else {
        timer = setTimeout(function() {
           run_on_simple_click(parameter);
        }, 150);
        clickedOnce = true;
    }
});

function run_on_simple_click(parameter) {
    alert(parameter);
    alert("simpleclick");
    clickedOnce = false;
}

function run_on_double_click() {
    clickedOnce = false;
    clearTimeout(timer);
    alert("doubleclick");
}

这是一个有效的JSFiddle

有关您应该为计时器使用什么延迟的详细信息,请查看此处:How to use both onclick and ondblclick on an element?

答案 1 :(得分:3)

$("#test-id").bind("click dblclick", function(){alert("hello")});

适用于click和dblclick

编辑 -

我认为这是不可能的。我正在尝试这样的事情。

$("#test").bind({
    dblclick: function(){alert("Hii")},
    mousedown: function(){alert("hello")}

});

但是不经过单击就无法达到双击。我试过鼠标但没有给出任何解决方案。

答案 2 :(得分:2)

我几乎和Jeremy D使用相同的逻辑。

但是,在我的情况下,使用匿名函数解决这个问题更加巧妙,并且双击超时稍慢:

dblclick_timer = false
.on("click", function(d) {
    // if double click timer is active, this click is the double click
    if ( dblclick_timer )
    {
        clearTimeout(dblclick_timer)
        dblclick_timer = false
        // double click code code comes here
        console.log("double click fired")
    }
    // otherwise, what to do after single click (double click has timed out)
    else dblclick_timer = setTimeout( function(){
        dblclick_timer = false
        // single click code code comes here
        console.log("single click fired")
    }, 250)
})

答案 3 :(得分:0)

您需要跟踪双击,如果不是双击,则执行点击操作。 试试这个

<p id="demo"></p>
<button id='btn'>Click and DoubleClick</button>
<script>
var doubleclick =false;
var clicktimeoutid = 0;
var dblclicktimeoutid = 0;
var clickcheck = function(e){
    if(!clicktimeoutid)
        clicktimeoutid = setTimeout(function(){
            if(!doubleclick)
                performclick(e);
            clicktimeoutid  =0;
        },300);
}

var performclick =function(e){
     document.getElementById("demo").innerHTML += 'click';  
}
var performdblclick = function(e)
{
    doubleclick = true;
    document.getElementById("demo").innerHTML += 'dblclick';
    dblclicktimeoutid  = setTimeout(function(){doubleclick = false},800);
};
document.getElementById("btn").ondblclick = performdblclick;
document.getElementById("btn").onclick=clickcheck;
</script>

答案 4 :(得分:0)

稍微不同的方法 - 实际的点击比较稍后在timeOut函数中发生,在预设的时间间隔之后...直到那时我们只是在标记上保留标签。

&安培;通过一些简单的修改(点击计数器而不是标志),它还可以扩展到任意数量的快速连续点击(三次点击等),受实用性的限制。

     func saveTextFromTextFieldToCoreData(textToSave: String){

    let appDelegate = UIApplication.sharedApplication().delegate as! AppDelegate
    let managedContext = appDelegate.managedObjectContext

    let entityDescription =  NSEntityDescription.entityForName("GoalDetail", inManagedObjectContext:managedContext)

    let thingToSaveToCD = NSManagedObject(entity: entityDescription!, insertIntoManagedObjectContext: managedContext)

    //clumsy named entity is empty returns if there is already
    // an ID / data.timeStamp in that entity so that I can
    // either save or replace the data
    print("received text to store and it's \(textToSave)")

    if  entityIsEmpty("GoalDetail") == true {
        thingToSaveToCD.setValue(data.timeStamp, forKey: "id")
        thingToSaveToCD.setValue(textToSave, forKey: "detailText")
        print("succesfully saved \(data.timeStamp) and \(textToSave)")

    } else {
        replaceTheValueFromCoreData()
        print("ovo tribq prominiti")

    }

}



 func replaceTheValueFromCoreData(){

    print("i have entered the delete core data item")
    let appDelegate = UIApplication.sharedApplication().delegate as! AppDelegate
    let managedContext = appDelegate.managedObjectContext

    let fetchRequest = NSFetchRequest(entityName: "GoalDetail")
    let predicate = NSPredicate(format: "id == %@", self.data.timeStamp)
    fetchRequest.predicate = predicate

    do {
    if let fetchResults = try appDelegate.managedObjectContext.executeFetchRequest(fetchRequest) as? [NSManagedObject] {
        if fetchResults.count != 0{

            var managedObject = fetchResults[0]
            managedObject.setValue(self.trextViewForGoal.text, forKey: "detailText")

            try managedContext.save()
        }
        }}

        catch let error as NSError {
            // failure
            print("Fetch failed: \(error.localizedDescription)")
        }
}