0

我从以下资源 下载了bootstrap-tagsinput库的源 JS 和 CSS： http ://timschlechter.github.io/bootstrap-tagsinput/examples/

在我的 asp.net 网站中，我以下列方式使用它：

 <asp:TextBox ID="txtCompany" style="font-size:x-large" runat="server" data-role="tagsinput" CssClass="form-control" placeholder="Add Company" />

 <script type="text/javascript">
    $('input #txtCompany').tagsinput();
    alert($('input #txtCompany').val());
 </script>

但是警报实际上应该返回我创建的标签，而是返回：undefined

JS 是用Master Page. 所有的 CSS 和 JS 引用也都在Master Page.

这里有什么问题 ？

编辑 ：

TextBox 呈现如下： 在此处输入图像描述

编辑 ：

使用以下 jQuery 代码，我能够检索 div 的内容。

 $('#btn').click(function () {
                var div = document.getElementById("div");
                var spans = div.getElementsByTagName("span");

                for (i = 0; i < spans.length; i++) {
                    alert(spans[i].innerHTML);
                }
            });

但问题是它返回以下内容：

在此处输入图像描述

并且还显示了另一个空警报！我不知道为什么！

4

2 回答 2

2

您有 2 个选项，第一个是用浏览器上解析的 id 替换

<asp:TextBox ID="txtCompany" style="font-size:x-large" runat="server" data-role="tagsinput" CssClass="form-control" placeholder="Add Company" />

<script type="text/javascript">
    $('input #ContentPlaceHolder1_txtCompany').tagsinput();
    alert($('input #ContentPlaceHolder1_txtCompany').val());
 </script>

或者您将在文本框中添加一个类作为第二种解决方案，并将 jquery 代码中的 id 替换为类名而不是 id

<asp:TextBox ID="txtCompany" style="font-size:x-large" runat="server" data-role="tagsinput" class="form-control txtcomp" placeholder="Add Company" />

<script type="text/javascript">
    $('input .txtcomp').tagsinput();
    alert($('input .txtcomp').val());
 </script>

试试看，我认为它会起作用

编辑 您可以使用此功能在警报中显示添加的项目值

 $('input').on('itemAdded', function (event) {
     alert(event.item)
 });
于 2015-08-17T12:09:05.433 回答
0

您应该将属性 ClientIDMode 设置为“静态”以保留控件 ID，而前缀中没有父占位符 ID。像这样：

<asp:TextBox ID="txtCompany" ClientIDMode="Static" style="font-size:x-large" 
runat="server" data-role="tagsinput" CssClass="form-control" placeholder="Add Company" />
于 2018-05-02T13:12:48.517 回答