1

我正在使用名为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 个字符并且在文本区域上键入时不更新。如何解决这个问题?

4

3 回答 3

2

问题是更新面板,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');
});
于 2012-07-11T10:43:59.810 回答
0

我认为您必须将跨度留空。jQuery 插件会自己填充它。

于 2012-07-11T10:27:48.547 回答
0

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>

我希望它有帮助!

于 2012-07-11T10:34:45.910 回答