当前位置:  开发笔记 > 编程语言 > 正文

Select2 - 从js开始只读(不禁用!)

如何解决《Select2-从js开始只读(不禁用!)》经验,为你挑选了3个好方法。

如何动态地将select2组合框设置为只读?

这是我到目前为止所尝试的:

$('...').attr({'readonly': 'readonly'}).trigger('change.select2');
$('...').attr({'readonly': 'readonly'}).trigger('change');
$('...').select2().enable(false);

Ali Jamal.. 13

这是最新的解决方案select2(已通过测试4.0.7),使用css only

/*Select2 ReadOnly Start*/
    select[readonly].select2-hidden-accessible + .select2-container {
        pointer-events: none;
        touch-action: none;
    }

    select[readonly].select2-hidden-accessible + .select2-container .select2-selection {
        background: #eee;
        box-shadow: none;
    }

    select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow, select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {
        display: none;
    }

/*Select2 ReadOnly End*/


lafeber.. 10

Select2的解决方案- 问题#3387 - Readonly支持:

select[readonly].select2 + .select2-container {
  pointer-events: none;
  touch-action: none;

  .select2-selection {
    background: #eee;
    box-shadow: none;
  }

  .select2-selection__arrow,
  .select2-selection__clear {
    display: none;
  }
}


Cas Knook.. 9

参见:http : //select2.github.io/select2/

我这样做:

$("#modelname-fieldname").select2({disabled:readonly});

哪里:

modelname-fieldname 如下所示: $form -> field($modelname, "fieldname") -> widget(Select2::classname(), [ ... ]);

readonly 是true,false或字符串 readonly

(可选)您可以将鼠标悬停在该select2字段上时更改光标。



1> Ali Jamal..:

这是最新的解决方案select2(已通过测试4.0.7),使用css only

/*Select2 ReadOnly Start*/
    select[readonly].select2-hidden-accessible + .select2-container {
        pointer-events: none;
        touch-action: none;
    }

    select[readonly].select2-hidden-accessible + .select2-container .select2-selection {
        background: #eee;
        box-shadow: none;
    }

    select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow, select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {
        display: none;
    }

/*Select2 ReadOnly End*/



2> lafeber..:

Select2的解决方案- 问题#3387 - Readonly支持:

select[readonly].select2 + .select2-container {
  pointer-events: none;
  touch-action: none;

  .select2-selection {
    background: #eee;
    box-shadow: none;
  }

  .select2-selection__arrow,
  .select2-selection__clear {
    display: none;
  }
}



3> Cas Knook..:

参见:http : //select2.github.io/select2/

我这样做:

$("#modelname-fieldname").select2({disabled:readonly});

哪里:

modelname-fieldname 如下所示: $form -> field($modelname, "fieldname") -> widget(Select2::classname(), [ ... ]);

readonly 是true,false或字符串 readonly

(可选)您可以将鼠标悬停在该select2字段上时更改光标。


这不再是正确的答案。Select没有`readonly`属性,此(`.select2({disabled:readonly});`)也已从select2中删除。这样做的方法是禁用选择(如果需要发送值,则使用隐藏的输入)
推荐阅读
郑谊099_448
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有