如何让我的JavaScript在转发器中工作?

时间:2015-08-27 16:14:49

标签: javascript c# asp.net substring

我有一个使用转发器的asp.net项目。

<asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
        <HeaderTemplate>
            <asp:label ID="lblexp" runat="server" Text="05/11/1981" Visible="false"></asp:label>
        </HeaderTemplate>
        <ItemTemplate>                
            <div id="myNest" class="grid">
            <div class="imgholder">
                <img src="<%# Eval("ImageAlt1")%>" />
            </div>        
            <strong><%# Eval("ItemName")%> <bdo style="color:green;">$<%# Eval("ItemPrice")%></bdo></strong>
            <p class="test"><%# Eval("ItemDescription")%></p>
            <div style="color:red; font-size:small;"><asp:Label ID="lblExp" Text='<%# Bind("CreateDate") %>' runat="server" /></div>
            <div class="meta"><%# Eval("Email")%></div>
            </div>
        </ItemTemplate>
        <FooterTemplate>
            <asp:label ID="lblexp" runat="server" Text="05/11/1981" Visible="false"></asp:label>
        </FooterTemplate>

和一些缩短ItemDescription

的JavaScript
<script type="text/javascript">
    var after = 5;
    var html = $(".grid p.test").html();
    html = html.substring(0, after) + "<span> ...</span>";
    $(".grid p.test").html(html);
</script>

无论出于何种原因,javascript都无法看到转发器中的项目。我该如何解决这个问题?

错误是Uncaught TypeError:无法读取未定义的属性子字符串

2 个答案:

答案 0 :(得分:1)

这里有两个可能的问题:

  1. JS在呈现相关标记之前运行。要解决这个问题,只需将js包装在某种文档加载处理程序中:

    $(function() {
        var after = 5;
        var html = $(".grid p.test").html();
        html = html.substring(0, after) + "<span> ...</span>";
        $(".grid p.test").html(html);
    });
    
  2. html()调用为您提供选择器匹配列表中第一项的内部html。您可以为所有找到的项目执行此操作,在这种情况下将您的html操作放在each()中。顺便说一下,考虑text而不是html,它看起来与您的案例更相关。

答案 1 :(得分:1)

我怀疑在加载DOM之前你的脚本正在运行。将脚本标记移动到</body>标记的正上方,或者像这样包装脚本:

<script type="text/javascript">
  $(function () { // equivalent to $(document).on('ready', function...
    var after = 5;
    var html = $(".grid p.test").html();
    html = html.substring(0, after) + "<span> ...</span>";
    $(".grid p.test").html(html);
  });
</script>

传入的函数只能在DOM准备好解析后运行。这意味着你的逻辑不会运行直到整个页面准备就绪。