Question

我正在使用Tag Manager库。

我让它以最简单的水平工作 -

<head runat="server">

    <link rel="stylesheet" type="text/css" href="CSS/tagmanager.css" />

    <script type="text/javascript" src="Scripts/jquery/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="Scripts/tagmanager.js"></script>

</head>
<body>
    <form id="form1" runat="server">
    <div>

        <input type="text" name="tags" placeholder="Tags" class="tm-input"/>

    </div>

          <script>
              $(".tm-input").tagsManager();
    </script>

    </form>
</body>
</html>

是否可以定义标签在页面上的放置位置？更具体地说，我打算将标签附加到另一个充当容器的文本框。我在文档中找不到如何指定位置的任何地方。

这是一个有效的example JSFIDDLE

Answer 1

如果您看到docs [滚动到Tagmanager Configuration]

，则已有可供选择的选项

tagsContainer ：可选的jQuery选择器，用于包含标签。默认值：标签会在标签输入之前出现。

代码：

$(function () {
    $(".tagsManager").tagsManager({
         prefilled: ["Pisa", "Rome"],
         CapitalizeFirstLetter: true,
         preventSubmitOnEnter: true,
         typeahead: true,
         typeaheadAjaxSource: null,
         typeaheadSource: ["Pisa", "Rome", "Milan", "Florence", "New York", "Paris",      "Berlin", "London", "Madrid"],
         delimeters: [44, 188, 13],
         backspace: [8],
         blinkBGColor_1: '#FFFF9C',
         blinkBGColor_2: '#CDE69C',
         hiddenTagListName: 'hiddenTagListA',
         tagsContainer: '#testcontainer'
     });
});

<input type="text" name="tags" placeholder="Tags" class="tagsManager"
/>
<input type="hidden" value="Pisa,Rome" name="hiddenTagList">
<div id="testcontainer"><h2>Tags here:</h2></div>

Fiddle Demo

Answer 2

我不完全确定你展示的函数会产生什么样的输出，但是不能将生成的代码用jQuery移动到你想要的任何地方？像这样：

<script>
//First execute your function
$(".tm-input").tagsManager();
//Then move it somewhere else
$("#form1").appendTo(".some-other-container");
</script>

在哪里＆＃39; .some-other-container＆＃39;是一个div与class =＆＃34; some-other-container＆＃34;

您还可以使用insertAfter（）在某个div之后移动代码。

将标签附加到文本框

2 个答案: