使用javascript或jquery验证

如何动态创建文本框，当我单击添加按钮。使用javascript或jquery验证

我把输入栏放在文本框中。

如何使用javascript或jquery验证动态创建的文本框。

<html> 
<head> 
<title>Adding and Removing Text Boxes Dynamically</title> 

<script type="text/javascript"> 
var intTextBox=0; 
//FUNCTION TO ADD TEXT BOX ELEMENT 
function addElement(){ 
    intTextBox = intTextBox + 1; 
    var contentID = document.getElementById('content'); 
    var newTBDiv = document.createElement('div'); 
    newTBDiv.setAttribute('id','strText'+intTextBox); 
    newTBDiv.innerHTML = "Text "+intTextBox+": <input type='text' id='" + intTextBox + "' name='" + intTextBox + "'/>"; 
    contentID.appendChild(newTBDiv); 
} 

    </head> 
    <body> 
    <p>Demo of Adding and Removing Text Box Dynamically using JavaScript</p> 
    <p><a href="javascript:addElement();" >Add</a> 
     <a href="javascript:removeElement();" >Remove</a> 
    </p> 
    <div id="content"></div> 
    <input type="button" value="submit"/> 
    </body> 
    </html>

当我点击提交按钮，所有的文本框验证必须完成之后....

来源

2012-02-27 specialuser

你是什么 “验证文本” 是什么意思？检查它是否存在？验证用户添加到其中的输入？你是什么意思“动态创建文本框 - 当发生什么事件时动态创建？ – alfasin 2012-02-27 07:51:46

是验证动态创建的文本框....是否有可能？ – specialuser 2012-02-27 07:53:37

当然，当你创建文本框时用ID指定它，然后使用getElementById（）以确保它存在 – alfasin 2012-02-27 07:54:45

试着复制这个和测试。让我们告诉我，这是你需要的。

<!DOCTYPE HTML> 
<html> 
<head> 
<title>Adding and Removing Text Boxes Dynamically</title> 

<script type="text/javascript"> 
var intTextBox = 0 ;//FUNCTION TO ADD TEXT BOX ELEMENT 
function addElement(){ 
    intTextBox += 1 
    var contentID = document.getElementById('content'); 
    var newTBDiv = document.createElement('div'); 
    newTBDiv.setAttribute('id','strText'+intTextBox); 
    newTBDiv.innerHTML = "Text "+intTextBox%x+": <input type='text' id='%2+ intTextBox + "' name='" + intTextBox + "' />"; 
    contentID.appendChild(newTBDiv); 
} 

function removeElement(){ 
    var element = document.getElementById("strText"+intTextBox); 
    console.log(element); 
    while (element.firstChild) { 
     element.removeChild(element.firstChild); 
    } 
    intTextBox -=1; 
} 
</script> 
</head><body> 
<p>Demo of Adding and Removing Text Box Dynamically using JavaScript</p> 
<p><a href="javascript:addElement()" >Add</a> 
    <a href="javascript:removeElement();" >Remove</a> 
</p> 
<div id="content"></div> 
<input type="button" value="submit"/> 
</body> 
</html>

多见于My jsFiddle

注：与Firefox & Chrome的工作

来源

2012-02-27 09:07:04 OammieR

其中的k ..但如何验证输入文本框... – specialuser 2012-02-27 09:49:14

创建文本框：

var textbox = $('<input></input>'); 
textbox.setAttr(type, 'text');

放入容器：

$('#button').onclick(function() { 
    $('#container').append(textbox); 
});

验证：

$('#submit').onclick(function() { 
    if(!$('#textbox').val()) { 
     alert('input empty'); 
    } 
});

来源

2012-02-27 07:55:13

这只用于单个文本框..但我要求动态创建的文本框验证.. – specialuser 2012-02-27 08:37:28

功能的addElement（） { intTextBox = intTextBox + 1; 变种内容识别=的document.getElementById（ '内容'）; VAR newTBDiv =使用document.createElement（ 'DIV'）; newTBDiv。的setAttribute（ '编号'， 'strText的' + intTextBox）; newTBDiv.innerHTML =“Text”+ intTextBox +“：”; contentID.appendChild（newTBDiv）; } – specialuser 2012-02-27 08:40:02

我问过上面代码创建的文本框验证... – specialuser 2012-02-27 08:40:52

您可以使用此jQuery Validation Plugin。 demo显示可以验证文本框。

来源

2012-02-27 07:55:42 PiTheNumber

– specialuser 2012-02-27 08:39:28

function addSense（sense）{comment.content + = sense; } – PiTheNumber 2012-02-27 11:33:11

这是很多问题汇总成一个。您可以创建并使用代码插入jQuery的元素如下所示：

$('<input />', {type : 'text'}).appendTo($(body));

至于验证而言，这将取决于当你想这样做的。在按键上提交，在模糊等，如果你想在页面加载后毯子验证了你需要，因为在创建这些文本框将其委托给一些父元素的所有输入：

$('body').delegate('input','keyup', function(){ 
    /*Do stuff*/ 
});

但如果创建元素时您还可以附加验证，如果它需要特定于您创建的字段。

$('<input />', {type : 'text'}).bind('keyup', function(){ 
    /*Do stuff*/ 
}).appendTo($(body));

我希望你能朝正确的方向前进。祝你好运

来源

2012-02-27 08:42:19 Marlin

谢谢...我会试试...... – specialuser 2012-02-27 08:51:01

使用javascript或jquery验证

回答

相关问题