0

请友好一点。我正在尝试创建一个设置限制并减少多余部分（从指定限制开始）的页面。示例：限制为 3。然后，我将输入 abc，如果我输入 d，它必须说已达到其限制并且 abc 将保留。我的问题是它只是删除了我以前的输入并进行了新的输入。期待您的大力合作。谢谢。

    <html>
    <script type="text/javascript">

     function disable_btn_limit(btn_name)
     {
     /* this function is used to disable and enable buttons and textbox*/
    if(btn_name == "btn_limit")
{
        document.getElementById("btn_limit").disabled = true;
        document.getElementById("ctr_limit_txt").disabled = true;
        document.getElementById("btn_edit_limit").disabled = false;
}
         if(btn_name == "btn_edit_limit")
{
        document.getElementById("btn_limit").disabled = false;
        document.getElementById("ctr_limit_txt").disabled = false;
        document.getElementById("btn_edit_limit").disabled = true;
}
   }

     function check_content(txtarea_content)
    {
        /*This function is used to check the content*/
    // initialize an array
var txtArr = new Array();
       //array assignment
      //.split(delimiter) function of JS is used to separate 
     //values according to groups; delimiter can be ;,| and etc
txtArr = txtarea_content.split("");
var newcontent = "";
var momo =  new Array();
var trimmedcontent = "";
var re = 0;
var etoits;
var etoits2;

    //for..in is a looping statement for Arrays in JS. This is similar to foreach in C# 
    //Syntax: for(index in arr_containter) {}
for(ind_val in txtArr)
{
    var bool_check = check_if_Number(txtArr[ind_val])
    if(bool_check == true)
    {
        //DO NOTHING
    }
    else
    {


        //trim_content(newcontent); 
        newcontent += txtArr[ind_val];
        momo[ind_val] = txtArr[ind_val];
    }
}
var isapa = new Array();
var s;
re = trim_content(newcontent);  

for(var x = 0; x < re - 1; x++){

    document.getElementById("txtarea_content").value += momo[x];
    document.getElementById("txtarea_content").value = "";

}

     }
       function trim_content(ContentVal)
     {
//This function is used to determine length of content
//parseInt(value) is used to change String values to Integer data types.
//Please note that all value coming from diplay are all in String data Type
var limit_char =parseInt(document.getElementById("ctr_limit_txt").value);
var eto;
if(ContentVal.length > (limit_char-1))
{ 
    alert("Length is greater than the value specified above: " +limit_char);
    eto = limit_char ;
    etoits = document.getElementById("txtarea_content").value;
    //document.getElementById("txtarea_content").value = "etoits";
    return eto;
    //for(var me = 0; me < limit_char; me++)
    //{document.getElementById("txtarea_content").value = "";}
}
return 0;
  }

    function check_if_Number(ContentVal)
{
   //This function is used to check if a value is a number or not
   //isNaN, case sensitive, JS function used to determine if the values are 
        //numbers or not. TRUE = not a number, FALSE = number
if(isNaN(ContentVal))
{
    return false;
}
else
{ alert("Input characters only!");
    return true;
}
      }



</script>
   <table>
   <tr>
   <td>
  <input type="text" name="ctr_limit_txt" id="ctr_limit_txt"/>
   </td>
        <td>
        <input type="button" name="btn_limit" id="btn_limit" value="Set Limit"         onClick="javascript:disable_btn_limit('btn_limit');"/>
     </td>
     <td>
  <input type="button" name="btn_edit_limit" id="btn_edit_limit" value="Edit Limit"       disabled="true" onClick="javascript:disable_btn_limit('btn_edit_limit');"/>
     </td>
   </tr>
        <tr>
   <td colspan="2">
  <textarea name="txtarea_content" id="txtarea_content" onKeyPress="javascript:check_content(this.value);"></textarea>
     <br>
    *Please note that you cannot include <br>numbers inside the text area
     </td>
 </tr>

    </html>
4

4 回答 4

0

尝试用这个替换：

for(var x = 0; x < re - 6; x++){
    document.getElementById("txtarea_content").value += momo[x];
    document.getElementById("txtarea_content").value = "";
}
于 2012-08-28T17:45:56.563 回答
0

Try this. If the condition is satisfied return true, otherwise return false.

<html>
<head>
    <script type="text/javascript">
        function check_content(){
            var text = document.getElementById("txtarea_content").value;
            if(text.length >= 3){
                alert('Length should not be greater than 3');
                return false;
            } else { 
            return true;
            }
        }
    </script>
</head>
<body>
    <div>
        <textarea name="txtarea_content" id="txtarea_content" onkeypress=" return check_content();"></textarea>
    </div>
</body>
</html>
于 2012-08-28T17:57:38.593 回答
0

Instead of removing the extra character from the text area, you can prevent the character from being written in the first place

function check_content(event) {  //PARAMETER is the event NOT the content
    txtarea_content = document.getElementById("txtarea_content").value; //Get the content 

    [...]

    re = trim_content(newcontent);

    if (re > 0) {
        event.preventDefault();   // in case the content exceeds the limit, prevent defaultaction ie write the extra character
    }

    /*for (var x = 0; x < re - 1; x++) {
    document.getElementById("txtarea_content").value += momo[x];
    document.getElementById("txtarea_content").value = "";
    }*/
}

And in the HTML (parameter is the event):

<textarea ... onKeyPress="javascript:check_content(event);"></textarea>
于 2012-08-28T17:58:24.347 回答
0

为什么文本输入上的 maxlength 属性不适用于这么少的字符？在您的情况下，您将拥有：

<input type="text" maxlength="3" />

或者如果是 HTML5，你仍然可以使用 textarea：

<textarea maxlength="3"> ...

然后只需有一个标签，指示任何输入的三个字符限制。

于 2012-08-28T21:43:23.233 回答