Question

我在jQuery中使用ddSlick插件，而onSelected方法只应在我从创建的Dropdown中选择一个选项时运行。

唯一的问题是，我的以下代码似乎在页面加载后立即运行onSelected。

有人能指出我正确的方向吗？

$('#flag').ddslick({
    imagePosition:"left",
    background:"none",
    width:"66px",
    onSelected: function(data){
        var chosenCountry = data.selectedData.value;
        chosenCountry = chosenCountry.toLowerCase();
        if(data.selectedIndex > 0) {
            if( new_url[1] in oc(['de', 'es','fr','it']) ) {
                console.log("translated pages");
            }
        } else {
            console.log("English site");
        }
    }   
});

jsFiddle

由于

Answer 1

我已经发明了一个解决方案，经过数小时的研究后发现了这个问题。

我直接改变了代码。

注意：您需要使用unminified version按照此说明操作。

第220行

查找

function selectIndex(obj, index) {

将其更改为：

function selectIndex(obj, index, a) {

第270行

查找

if (typeof settings.onSelected == 'function') {
   settings.onSelected.call(this, pluginData);
}

将其更改为：

if (typeof settings.onSelected == 'function') {
    if (a !== true) settings.onSelected.call(this, pluginData);
}

最后在第146行

查找

selectIndex(obj, index)

然后将其更改为

selectIndex(obj, index, true)

希望有所帮助！

Answer 2

它很脏且很笨，但是它可以快速修复（使用缩小版本并且不想切换我的一小段代码）。我刚刚定义了一个全局bool，并在第一次加载时将其设置为true。

var _ddlLoaded = false;
$(function () {
    $('#ddl').ddslick({
            data: ddlData,
             onSelected: function (data) {
                if(_ddlLoaded  === false) {
                    _ddlLoaded = true;
                }
                else {
                    console.log(data.selectedData.value);
                }
    });
});

Answer 3

你可以随时查看ddSlick Remablized它修复了这个问题，并添加了一些其他很酷的功能，如键盘，类和禁用/启用支持！

或者你想要自己去做这个功能

function selectIndex(obj, index) {

比你找到的功能底部

//Callback function on selection
if (typeof settings.onSelected == 'function') {
        settings.onSelected.call(this, pluginData);
}

删除剪切并粘贴以下评论上方的部分

//If set to display to full html, add html

然后将if语句更改为

if (typeof settings.onSelected == 'function' && ddSelected.text().length > 0) {

ddSlick Remablized甚至被Prashant Chaudhary亲自发了推文！请在此处查看https://twitter.com/chaudharyp/status/268045906442584064

Answer 4

您也可以尝试此jsFiddle

   function oc(a){
     var o = {};
     for(var i=0;i<a.length;i++){
       o[a[i]]='';
     }
     return o;
   }
   var temp = 0;
   $('#flag').ddslick({
     imagePosition:"left",
     background:"none",
     width:"66px",
     onSelected: function(data){
       var chosenCountry = data.selectedData.value;
       chosenCountry =    chosenCountry.toLowerCase();
       if(data.selectedIndex >= 0 && temp==1) {
          if( chosenCountry  in oc(['uk','de', 'es','fr','it']) ) {
             alert("translated pages");
          }
       } 
       temp = 1;
     }   
   });

ddslick方法onSelected正在运行

4 个答案: