FBJS 文本区域倒计时

发布于 2024-08-06 08:22:46 字数 931 浏览 5 评论 0原文

我在 Facebook 应用程序中有一个 textarea 元素，我想在视觉上限制一定数量的字符。这是我从网上获得的代码片段：

  <script>

  function textCounter(textarea, countdown, maxlimit)
  {
    textareaid = "ta1";
    if (textareaid.value.length > maxlimit)
      textareaid.value = textareaid.value.substring(0, maxlimit);
    else
      document.getElementById(countdown).value = '('+(maxlimit-textareaid.value.length)+' characters available)';
  }

</script>

<form>
    <textarea id="ta1" name="ta1" rows=5 cols=20
      onKeyDown="textCounter('ta1','ta1count',100);"
      onKeyUp="textCounter('ta1','ta1count',100);"
    ></textarea>
    <br/>
    <input id="ta1count" readonly type="text" size="30"/>
</form>

<script type="text/javascript">
    textCounter('ta1','ta1count',100);
</script>

此脚本在 Facebook 框架之外运行良好，但我不明白 FBJS 的限制以及我需要更改哪些内容才能使此脚本正常工作。有没有人成功实现类似的功能？

谢谢。

原文

I have a textarea element in a Facebook application I want to limit, visually, to a certain number of characters. This is a code snippet I got from the web:

  <script>

  function textCounter(textarea, countdown, maxlimit)
  {
    textareaid = "ta1";
    if (textareaid.value.length > maxlimit)
      textareaid.value = textareaid.value.substring(0, maxlimit);
    else
      document.getElementById(countdown).value = '('+(maxlimit-textareaid.value.length)+' characters available)';
  }

</script>

<form>
    <textarea id="ta1" name="ta1" rows=5 cols=20
      onKeyDown="textCounter('ta1','ta1count',100);"
      onKeyUp="textCounter('ta1','ta1count',100);"
    ></textarea>
    <br/>
    <input id="ta1count" readonly type="text" size="30"/>
</form>

<script type="text/javascript">
    textCounter('ta1','ta1count',100);
</script>

This script works well outside of a Facebook frame, but I don't understand the limitations of FBJS and what I'd need to change to make this script work. Has anyone had success implementing a similar feature?

Thanks.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

離殇 2024-08-13 08:22:46

您发布的代码片段不起作用。

这是一个确实有效的版本（经过测试）

<html>
<head>
<title>Tarea test</title>
<script type="text/javascript">

function id (e) {
    return document.getElementById(e);
}

window.onload = function () {

    var oElement = id('message');
    var iMaxChars = 300;

    oElement.onblur = getHandler(iMaxChars);
    oElement.onfocus = getHandler(iMaxChars);
    oElement.onchange = getHandler(iMaxChars);
    oElement.onkeyup = getHandler(iMaxChars);

    updateTextArea('message', iMaxChars);

}

function getHandler(iMaxChars) {
  return function () { updateTextArea('message', iMaxChars) };
}

function updateTextArea(sTextAreaID, iMessageMaxLength) {
    var oTextAreaNode = id(sTextAreaID);
    var oMessageCounter = id('messagecounter');

    var sMessageValue = oTextAreaNode.value;
    var iMessageLength = sMessageValue.length;

    if (iMessageLength > iMessageMaxLength) {
        oTextAreaNode.value = sMessageValue.substr(0, iMessageMaxLength);
        iMessageLength=iMessageMaxLength;
    }
    oMessageCounter.innerHTML = ""+(iMessageMaxLength - iMessageLength);
}

</script>
</head>
<body>

<form action="#" method="post"> 
  <fieldset> 
    <label for="message" id="messagelabel">Message <span id="messagecounter">300</span></label> 
    <textarea id="message" name="message" rows="10" cols="50"></textarea> 
  </fieldset>
</form>
</body>
</html>

在您的示例中，您试图从字符串中获取值。 textareaid.value
textareaid 不是此范围内的节点。

You code snippet you posted doesn't work.

here is a version that does work (is tested)

<html>
<head>
<title>Tarea test</title>
<script type="text/javascript">

function id (e) {
    return document.getElementById(e);
}

window.onload = function () {

    var oElement = id('message');
    var iMaxChars = 300;

    oElement.onblur = getHandler(iMaxChars);
    oElement.onfocus = getHandler(iMaxChars);
    oElement.onchange = getHandler(iMaxChars);
    oElement.onkeyup = getHandler(iMaxChars);

    updateTextArea('message', iMaxChars);

}

function getHandler(iMaxChars) {
  return function () { updateTextArea('message', iMaxChars) };
}

function updateTextArea(sTextAreaID, iMessageMaxLength) {
    var oTextAreaNode = id(sTextAreaID);
    var oMessageCounter = id('messagecounter');

    var sMessageValue = oTextAreaNode.value;
    var iMessageLength = sMessageValue.length;

    if (iMessageLength > iMessageMaxLength) {
        oTextAreaNode.value = sMessageValue.substr(0, iMessageMaxLength);
        iMessageLength=iMessageMaxLength;
    }
    oMessageCounter.innerHTML = ""+(iMessageMaxLength - iMessageLength);
}

</script>
</head>
<body>

<form action="#" method="post"> 
  <fieldset> 
    <label for="message" id="messagelabel">Message <span id="messagecounter">300</span></label> 
    <textarea id="message" name="message" rows="10" cols="50"></textarea> 
  </fieldset>
</form>
</body>
</html>

In you example you are trying to get a value from a string. textareaid.value
textareaid isn't a node in this scope.

回复收藏 0 原文

~没有更多了~