Question

我正在使用名为Limit的Jquery插件，如下所示

    $(document).ready(
    function () {
        $('[id$=Textarea1]').limit('150', '#charsLeft');
    });

相关ASPX部分，

<td align="left" valign="top">
    <textarea id="Textarea1" class ="limit" runat="server" rows="4" cols="30" style="resize: none;
        background-color: #F9E8EC; font-family: 'Times New Roman', Times, serif;" ></textarea>
    <br />
    You have <span id="charsLeft">160</span> chars left.
</td>

以上控件都在更新面板内。拳头时间我可以看到这个限制功能工作正常。但是当更新面板更新的跨度显示160个字符并且在文本区域上键入时不更新。如何解决这个问题？

Answer 1

问题在于更新面板，而document ready效果不佳。更新面板实际上取代了页面上的所有内容，但由于document已经ready，因此永远不会重新触发事件。

您要做的是将document ready事件移动到单独的函数中，然后在文档就绪期间调用它，并在更新面板中发生更新时调用它像这样：

function onDocumentReady()
{
    $('[id$=Textarea1]').limit('150', '#charsLeft');
}

// this will get called on the first load
$(function()
{
    onDocumentReady();
});

// this will get called when an update panel request finishes
var pageRequestManager = Sys.WebForms.PageRequestManager.getInstance(); 
pageRequestManager.add_endRequest(onDocumentReady);

或者（未经测试）

您可以执行的操作是在重新加载更新面板时触发ready上的document事件，您可以尝试这样做：

// this will get called on the first load
$(function()
{
    $('[id$=Textarea1]').limit('150', '#charsLeft');
});

// this will get called when an update panel request finishes, triggering the dom ready
var pageRequestManager = Sys.WebForms.PageRequestManager.getInstance(); 
pageRequestManager.add_endRequest(function()
{
    $(document).trigger('ready');
});

Answer 2

我认为你必须留空。 jQuery插件将自己填充。

Answer 3

Damith我尝试了你的代码，它对我来说完全没问题。你收到任何错误吗？

以下是我正在使用的HTML代码，JavaScript与您拥有的相同。

<form id="form1" runat="server">
 <asp:ScriptManager runat="server" />
 <asp:UpdatePanel ID="upd1" runat="server">
   <ContentTemplate>    
     <textarea id="Textarea1" class ="limit" runat="server" rows="4" cols="30"      style="resize: none; background-color: #F9E8EC; font-family: 'Times New Roman', Times, serif;" ></textarea>
<br />
 You have <span id="charsLeft">160</span> chars left.
<asp:Button ID="btnTest" runat="server" Text="Test" />
</ContentTemplate>

我希望它有所帮助！

字符限制在更新面板内不起作用

3 个答案:

或者（未经测试）