Question

如何为使用Dropkick jQuery plugin设置样式的<select>元素指定“点击”功能？ Dropkick不直接支持click函数，所以我试图创建一个单独的“click”函数，但我尝试过的方法不起作用

$('#Select1').click(function () {
    var $select2 = $('#Select2');
    removeDefaultFromSelect($select2);
});

我知道更改事件处理程序必须使用插件的“自定义change回调”进行分配，但我假设有一种方法可以在使用Dropkick设置样式的元素上调用click函数（特别是因为this SO posting似乎暗示有可能在Dropkick的“自定义change回调”中调用它。

我正在尝试添加点击功能，以便在单击“＃Select1”时触发下面的功能，而不仅仅是在更改时。我在这里发布了一个有关函数的工作示例：http://jsfiddle.net/chayacooper/zJ5c3/#username

现有功能

// Helper function that removes "_default" from the end of the option values for the given select element.
function removeDefaultFromSelect($select) {
    $select.find('option[value$=_default]').prop('value', function(i, value){ return value.replace(/_default$/g, '');
    });
}

$('#Select1').dropkick({
    change: function(value) {     
        var $select2 = $('#Select2');
        removeDefaultFromSelect($select2);
        $select2.val(value);      
    }
});

Answer 1

我还没有找到一种方法来使用Dropkick的click事件，但我通过创建2组<select>元素找出了一个有点复杂的临时解决方法 - 一组使用标准元素并且隐藏了（display:none），以及另一个使用Dropkick并且对用户可见的集合。因为它使用change()方法，所以如果用户点击下拉框然后有意识地决定保留“默认”值，则不会修改该值。

我发布了一个关于我在这里使用的方法的小提琴：http://jsfiddle.net/john_s/yhAX5/4/。

function removeDefaultFromSelect($select) {
    $select.find('option[value$=_default]').prop('value', function(i, value){ return value.replace(/_default$/g, '');
    });
}

$('#Select1').dropkick({
    change: function(value) {
        var $select2 = $('#Select2');
        removeDefaultFromSelect($select2);
        $select2.val(value);
    }
});

将Click函数分配给使用Dropkick jQuery插件设置样式的select元素

1 个答案: