javascript - 结合click和dblclick

我应该如何将以下内容合并为一个工作脚本？
当用户选择的颜色出现时，单击时，再次单击颜色变为白色，双击则显示为绿色。代码太长，我试图将它们合并，但是我犯了错误。

//single click
$('#pixel_canvas').on('click', 'td', function () {
    var color = $('#colorPicker').val();
    if ($(this).hasClass("blank") == true) {
        $(this).css('background-color', color);
        $(this).removeClass('blank');
    }
    else {
        $(this).addClass('blank');
        $(this).css('background-color', 'white');
    }
});
//double click
$('#pixel_canvas').on('dblclick', 'td', function () {
    var color = $('#colorPicker').val();
    if ($(this).hasClass("blank") == true) {
        $(this).css('background-color', color);
        $(this).removeClass('blank');
    }
    else {
        $(this).addClass('blank');
        $(this).css('background-color', 'aqua');
    }
});

最佳答案

我会这样：

// Take your actual 'core' code and turn it into a jQuery function:
$.fn.setColor(colorOff){
    if( $(this).hasClass("blank") ){
        $(this)
            .css('background-color', $('#colorPicker').val())
            .removeClass('blank');
    } else{
        $(this)
            .addClass('blank')
            .css('background-color',colorOff);
    }
}

// Now bind the events to the element and pass the color needed for the events:
$('#pixel_canvas')
    .on('click','td',function(){
        $(this).setColor('white')
    })
    .on('dblclick','td',function(){
        $(this).setColor('aqua')
    });

关于javascript - 结合click和dblclick，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/48278138/