2012-04-30 65 views
0

与jQuery我想让多个文本字段出现.. 当单击该文本Jquery的,每次点击按钮,一个文本框出现

<form> 
<input style="margin-top:20px;margin-right :50px; width:255px;height:23px;float:left;" type="text" name="CrawlerField"id="CrawlerField"/> 
<input style="margin-top: 15px; margin-right :50px; width:255px;height:23px;float:left;" type="text" name="CrawlerField1" id="CrawlerField1"/> 
<input style="margin-top: 15px; margin-right :50px; width:255px;height:23px;float:left;" type="text" name="CrawlerField1" id="CrawlerField2"/> 
<font id="jqueryAdd">Add button</font> 
</form> 

这是文本时,单击时出现一个新的文本字段... 。

在启动所有的文本框都隐藏
<font id="jqueryAdd">Add button</font> 

脚本

$("#CrawlerField1").hide(); 
$("#CrawlerField2").hide(); 

当点击该单词,添加与jqueryAdd 检查定义按钮,如果以前的文本字段是隐藏的文本框旁边出现在启动

$("#jqueryAdd").click(function (event) { 
     if($("#CrawlerField").is(":visible")) 
     $("#CrawlerField1").show(); 
     return false; 
}); 
$("#jqueryAdd").click(function (event) { 
     if($("#CrawlerField1").is(":visible")) 
     $("#CrawlerField2").show(); 
    return false; 
}); 

该代码产生的所有按钮的外观!

回答

0

添加class到所有<input>标签,如

<input class ="in" style="margin-top:20px;margin-right :50px; width:255px;height:23px;float:left;" type="text" name="CrawlerField"id="CrawlerField"/> 
<input class ="in" style="margin-top: 15px; margin-right :50px; width:255px;height:23px;float:left;" type="text" name="CrawlerField1" id="CrawlerField1"/> 
<input class ="in" style="margin-top: 15px; margin-right :50px; width:255px;height:23px;float:left;" type="text" name="CrawlerField1" id="CrawlerField2"/> 

和jQuery中加入这一行开始隐藏所有的输入。

$(".in").hide();