使用JavaScript从中继器获取文字值

Question

我有一个中继器，如下所示。 如何获取在后面的代码中设置文字的值（使用ltlText id）。

背后的代码

 ltlTitle.Text = Core.GetString(e.Item.DataItem("Title"))

ASPX

    <asp:Repeater ID="rptSlideshow" runat="server" EnableViewState="false">
                <ItemTemplate>
                    <div class="SlideItem">
                        <div id="divBottomText" class="SlideShowBottomText">
                          <h2 ><asp:Literal runat="server" ID="ltlTitle" EnableViewState="false" /></h2>
                          <p ><asp:Literal runat="server" ID="ltlDescription" EnableViewState="false" /></p>

                        </div>
                        <div class="SlideShowBottomUnderlay">&nbsp;</div>
                </ItemTemplate>
            </asp:Repeater>

我需要javascript代码来获取repeater和div中ltlTitle的值。

我试过了，但是没有用：

var value = $(this).closest('.divBottomText').find('[id*=ltlTitle]').text();
alert(value)

Answer 1

您的方法存在几个问题。

文字不呈现任何HTML标记。 因此，您无法使用javacript访问Literal。 使用呈现为跨度标签的标签。
即使使用Label，当Repeater重复其项目时，您也可能会看到多个同名标签（* _lblTitle_0，* _ lblTitle_1等）。 您可以在数组中获取其所有值，选择ID中包含“ lblTitle”的所有范围。
您在中继器中有一个未封闭的div。 您需要关闭它才能正常工作。

这就是我要做的。

这是我的标记，并使用jquery函数进行测试：

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>
    </title>
     <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
    <script type ="text/javascript">
        function myFunction() {
            var myArray = $("span[id*='lblTitle']").map(function() {
                return $(this).text();
            }).get();
            alert(myArray);
        }
    </script>
    <form id="form1" runat="server">
        <div>
            <asp:Repeater ID="rptSlideshow" runat="server" EnableViewState="false">
                <ItemTemplate>
                    <div class="SlideItem">
                        <div id="divBottomText" class="SlideShowBottomText">
                            <h2>
                                <asp:Label runat="server" ID="lblTitle" EnableViewState="false" Text='<%#Eval("Title") %>' />
                            </h2>
                            <p>
                                <asp:Literal runat="server" ID="ltlDescription" EnableViewState="false" /></p>
                        </div>
                        </div>
                        <div class="SlideShowBottomUnderlay">&nbsp;</div>
                </ItemTemplate>
            </asp:Repeater>
        </div>
        <input type="button" id="btn" onclick="myFunction();" value="TEST"/>
    </form>
</body>
</html>

在后面的代码中，我有一个类名MyClass，我正在创建MyClass对象的列表，并将其设置为页面的Page_Load事件中的转发器的数据源：

public partial class WebForm4 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            rptSlideshow.DataSource = new List<MyClass>()
            {
                new MyClass {Id = 1, Title = "Item 1", Description = "Item 1"},
                new MyClass {Id = 2, Title = "Item 2", Description = "Item 2"},
                new MyClass {Id = 3, Title = "Item 3", Description = "Item 3"},
                new MyClass {Id = 4, Title = "Item 4", Description = "Item 4"}

            };
            rptSlideshow.DataBind();
        }
    }

}

public class MyClass
{
    public int Id { get; set; }
    public string Title { get; set; }
    public string Description { get; set; }
}

当我运行测试并单击“测试”按钮时，会收到以下警报：

在此处输入图片说明

Answer 2

在浏览器开源代码中找到= ltlTitle

您必须确定。

id="ctl00_ltlTitle"可能会更改为。

Answer 3

alikarakoc是正确的，转发器将破坏ID客户端，这是所有ASP.NET Webforms容器对子项所做的工作。 您应该避免编写依赖于客户端ID的Javascript。

一种技术是使用C＃生成Javascript，然后将其动态注入到页面的<head>中。 这样，您可以引用Literal（或任何其他服务器控件）的ClientID属性，该属性将是正确的ID（包括容器名称前缀）。

使用JavaScript从中继器获取文字值

问题描述

3 个解决方案

解决方案1
1 2013-11-29 02:28:05

解决方案2
0 2013-11-28 21:00:39

解决方案3
0 2013-11-28 22:34:41

使用JavaScript从中继器获取文字值

问题描述

3 个解决方案

解决方案1 1 2013-11-29 02:28:05

解决方案2 0 2013-11-28 21:00:39

解决方案3 0 2013-11-28 22:34:41

解决方案1
1 2013-11-29 02:28:05

解决方案2
0 2013-11-28 21:00:39

解决方案3
0 2013-11-28 22:34:41