Динамически добавить текстовое поле с помощью jquery

Что не так с этим кодом? Только первый добавлять и удалять ссылка работает ...Динамически добавить текстовое поле с помощью jquery

<html> 
<head> 

<script type="text/javascript" src="jquery-1.3.2.min.js"></script> 

<style type="text/css"> 
div{ 
    padding:8px; 
} 
</style> 

</head> 

<body> 


<script type="text/javascript"> 

$(document).ready(function(){ 

    var counter = 2; 

    $(".addButton").click(function() { 

if(counter>5){ 
      alert("Only 5 textboxes allow"); 
      return false; 
} 

var newTextBoxDiv = $(document.createElement('div')) 
     .attr("id", 'TextBoxDiv' + counter); 

newTextBoxDiv.html('<TABLE><TR><TD>' + 
'<input type="text" name="textbox' + counter + 
'" id="textbox' + counter + '" value="" ></TD><TD><input type="text" name="textbox' + counter + 
'" id="textbox' + counter + '" value="" ></TD>&nbsp;<TD><a href="#" value="addButton" class="addButton">Add</a>&nbsp;<a href="#" value="removeButton" class="removeButton">Remove</a></TD></TR></TABLE>'); 

newTextBoxDiv.appendTo("#TextBoxesGroup"); 


counter++; 
    }); 

    $(".removeButton").click(function() { 
if(counter==1){ 
      alert("No more textbox to remove"); 
      return false; 
     } 

counter--; 

     $("#TextBoxDiv" + counter).remove(); 

    }); 

    $("#getButtonValue").click(function() { 

var msg = ''; 
for(i=1; i<counter; i++){ 
     msg += "\n Textbox #" + i + " : " + $('#textbox' + i).val(); 
} 
     alert(msg); 
    }); 
    }); 
</script> 
</head><body> 

<div id='TextBoxesGroup'> 
<div id="TextBoxDiv1"> 
    <TR><TD><input type='textbox' id='textbox1' ></TD>&nbsp;<TD><input type="text" name="textbox' + counter + 
'" id="textbox' + counter + '" value="" ></TD>&nbsp;<TD><a href="#" value="addButton" class="addButton">Add</a>&nbsp;<a href="#" value="removeButton" class="removeButton">Remove</a></TD></TR> 
</div> 
</div> 

</body> 
</html>

источник

2010-11-17 Hector Barbossa

Когда вы связать нажмите() обработчика, есть только один Add ссылка на странице, чтобы связываться с. Используйте live() для захвата кликов события для элементов, которые не находятся на странице еще:

$(".addButton").live("click", function() {

Работа демо: http://jsfiddle.net/u9hvp/

источник

2010-11-17 12:05:07

Благодаря спариваться это сделал благодарственное трюк –

для кода JQuery, это помогает мне хорошо. –

Использование живой() была обесценились, и удалены, так как пост Энди E в. Такая же функциональность теперь поддерживается, используя следующий синтаксис:

$ (документ) .На («щелчок», «.removeButton», функция() {

источник

2013-08-29 13:06:47 jlunavtgrad

вы просто добавить этот файл в папке его отлично работает ...!

JQuery-1.3.2.min.js

источник

2013-09-30 04:58:04

Динамически добавить текстовое поле с помощью jquery

ответ

Смежные вопросы