【问题标题】:How to use tags input of bootstrap with textarea tag (data-role="tagsinput")如何使用带有 textarea 标签的 bootstrap 标签输入(data-role="tagsinput")
【发布时间】:2017-04-24 22:06:41
【问题描述】:
 <textarea id="Box" class="tags form-control" placeholder="X Axis values"></textarea>

我想在带有删除选项的标签中显示用户选择的选项。

如何在 textarea 中使用 bootstrap 的标签输入?我已经应用了 data-role="tagsinput"。但是标签输入不起作用。正如我们所知,我们在 Stackoverflow 中遇到了同样的问题。但为此没有解决方案。

需要这个How to use tags input of bootstrap with textarea的解决方案/提示

【问题讨论】:

    标签: javascript html tags bootstrap-modal bootstrap-tags-input


    【解决方案1】:

    按照这个步骤进行

    <style>
    .bootstrap-tagsinput {
        line-height: 15px !important;
        min-height: 165px;
        padding-top: 20px;
        padding-bottom: 20px
    }
    
    span.tag.label {
        position: relative;
        float: left;
        margin: 2px 5px;
    }
    
    .bootstrap-tagsinput input {
        position: relative;
        float: left;
        height: auto;
        margin-top: 4px;
        margin-left: 5px;
        padding: 0px;
        text-align: left;
        width: auto;
    }
    <style/>
    <input type="text" class="form-control inputtags" data-role="tagsinput" name="keywords">
    

    【讨论】:

      【解决方案2】:

      在输入文本上尝试这个 css 以在 Input Like textarea 上滚动

      .tags-input {
            max-width: 100%;
            line-height: 22px;
            overflow-y: scroll;
            overflow-x: scroll;
            height: 65px;
            cursor: text;
       }
      

      【讨论】:

        【解决方案3】:

        引导标签输入does not work with textarea。不提供支持。

        但是,您可以将它与 input type="text" 一起使用并应用以下 css 使其像 textarea 一样工作。

        .bootstrap-tagsinput {
        min-height: 100px;
        }
        

        See this link

        【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2016-04-11
        • 2016-11-24
        • 2014-03-24
        • 1970-01-01
        • 2015-07-30
        • 1970-01-01
        • 1970-01-01
        • 2018-05-25
        相关资源
        最近更新 更多