如何使用javascript验证动态生成的文本字段

-2

我添加了使用php动态生成的动态名称动态生成的5个文本字段。我可以使用javascript验证这些字段。这里是小示例代码，但我的实际代码是不同的，如果你帮助我使用以下代码进行验证，我可以在那里做到这一点。帮我....如何使用javascript验证动态生成的文本字段

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script> 
function validate() 
{ 
//help me to write validation code here. 
} 
</script> 
</head> 
<body> 
<form method="post" action="##" name="test" onsubmit="return validate()"> 
<?php 
$i=0; 
while($i<5) 
{ 
echo "<input type='text' name='count$i'>" 
$i++; 
} 
echo "<input type='submit' value='ok'>"; 
?> 
</form> 
</body> 
</html>

来源

2013-10-22 Saravanan

您尝试过什么吗？ –

只需验证所有输入，或向要验证的所有输入添加一个类并验证它们。 – Timmetje

你会支持哪些浏览器？你是否有意避免使用jquery？ –

将类添加到元素。添加类元素的目的是捕捉只有你动态地添加这些元素，并希望验证

while($i<5) 
{ 
    echo "<input class='validate-it' type='text' name='count$i'>" 
    $i++; 
}

在JS

<script> 
function validate() 
{ 
    var elems = document.getElementsByClassName('validate-it'); 
    for(var i=0; i<elems.length; i++) { 
     // Validate here 
     // Code here depends on the type of validation you wants 
    } 
} 
</script>

如果你的描述类型的验证，我必将编辑答案你想要表演。希望这会有所帮助......

来源

2013-10-22 14:29:31

恕我直言，类更适合为CSS格式标记元素，而不是为页面中的元素提供功能性目标。

我建议给表单分配一个ID，这样你就可以用JavaScript来引用它，并用getElementById函数挑选它，然后遍历它的元素并为它们中的每一个执行你的验证函数，比如validateField（）。事情大致是这样的

function validateField(fieldToValidate) { 
    //Here you can perform your validation against fieldToValidate.value (for text inputs) 
} 


var frm = document.getElementById("myForm"); 
for (var i=0; frm.elements[i]; i++) 
{//Cycle through all input tags, of text type, inside the form 
    if (
     frm.elements[i].tagName=="INPUT" 
     && 
     frm.elements[i].getAttribute("type")=="text") 
     ) 
    { 
     validateField(frm.elements[i]); 
    } 
}

而且，如果你知道动态生成的元素的名字在你的榜样遵循特定的命名约定，如（countX X为数字），要验证只有动态 - 生成的输入字段，如果它们是文本输入字段，则只能检查thoose;更好的办法是将特定的ID而不是名称分配给字段，以确保你没有使用相同的名称并验证你不应该的东西。

PHP侧

<form method="post" action="##" id="myForm" name="test" onsubmit="return validate()"> 
<?php 
$i=0; 
while($i<5) 
{ 
echo "<input type='text' id='txtField$i'>" 
$i++; 
} 
?>

JS侧

function validateField(fieldToValidate) { 
    //Here you can perform your validation against fieldToValidate.value (for text inputs) 
} 


var frm = document.getElementById("myForm"); 
var currentField; 
for (var i=0; currentField = document.getElementById("txtField"+i); i++) 
{//Cycle through all txtField* starting IDs elements 
    validateField(currentField); 
}

来源

2013-10-22 14:47:17 Nillus

你没有名字（范围是多少？字符串特殊内容？等数）的详细类型的验证，所以这是一个常见的验证骨架的方式：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>test</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
    <script type="text/javascript"> 
     function validate() 
     { 
      var allInputsOk = true; 
      var inputs = document.getElementsByTagName("input"); 
      for (var inpx in inputs) { 
       if (inpx.substring(0, 5) == "count") { 
        // it's one of the inputs named "count..." 
        var inpIdx = inpx.substr(5); 
        var inpObj = document.getElementsByName(inpx)[0]; 
        var inpVal = inpObj.value; 
        allInputsOk &= validateSingleInput(inpIdx, inpVal); 
        if(!allInputsOk) break; 
       } 
      } 
      return allInputsOk; 
     } 
     /* 
     * Tests the value of the input named "countX" 
     * @return true if "value" is valid for input "count<index>", false else 
     */ 
     function validateSingleInput(index, value) { 
      var inputValueNumber = Number(value); // in case to test for numeric inputs 
      var inputValueString = String(value); // in case to test for string inputs 
      // your validation test here ... return true or false 
      return true; // dummy 
     } 
    </script> 
</head> 
<body> 
    <form method="post" action="#" name="test" onsubmit="return validate()"> 
     <?php 
     $i=0; 
     while($i<5) 
     { 
     echo "<input type='text' name='count$i'>"; 
     $i++; 
     } 
     echo "<input type='submit' value='ok'>"; 
     ?> 
    </form> 
</body> 
</html>

来源

2013-10-22 15:19:31

如何使用javascript验证动态生成的文本字段

回答

相关问题