Создание Textboxes ниже «вар Select_For_Multiple_Choices» кнопки

<html> 
<title> 
</title> 
<head> 
<script src="jquery-1.10.2.min.js"></script> 
<script> 
function AddingTextBoxes(){ 

var NumOfText=$("#NumOfTextBoxes").val(); 

$('#NewlyCreatedSelectBoxes').empty(); 

for(i=1; i<=NumOfText; i++){ 

var ipBoxName="MyInput"+i; 

var txtBoxAutoNumbering="<input type='text' name='textbx[]' style='width:50px;'   value="+i+" />&nbsp;&nbsp;&nbsp;"; 
    $('#NewlyCreatedSelectBoxes').append(txtBoxAutoNumbering); 

var txtBox="<input type='text' name='textbx[]'/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" 
    $('#NewlyCreatedSelectBoxes').append(txtBox); 

var Select_SelectionOptions="<select id='SelectOption'><option>Text_Box</option> <option>Text_Area</option><option>Radio_Button</option></select>&nbsp;&nbsp;&nbsp;"; 
    $('#NewlyCreatedSelectBoxes').append(Select_SelectionOptions); 

var Select_For_Multiple_Choices="<button type='button' onclick='ChildTxtBoxes()'   id='ABC'>Click for child selections</button><br><br>";  
    $('#NewlyCreatedSelectBoxes').append(Select_For_Multiple_Choices); 

} 




return false; 

/*for(var i=0; i<NumOfText; i++){ 
var x=1; 
NewlyCreatedSelectBoxes.innerHTML=NewlyCreatedSelectBoxes.innerHTML+"<br>AAA "+x+"<input  type='text' name='mytext'/>"; 
x++; 

} 
return false;*/ 
} 

function ChildTxtBoxes(){ 

var txtBox="<input type='text' name='textbx[]'/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" 
    $('#NewlyCreatedSelectBoxes').append(txtBox); 


} 


</script> 

</head> 
<body> 
<form > 
<div id="PHPForms" > 
<!--Designing PHP forms dynamically--> 
<label>Form Heading</label><input type="text"/><br><br> 
<label>Number of text boxes would needed</label><input id="NumOfTextBoxes" type="text"/> 
<button id="A" onclick=" return AddingTextBoxes()">Click</button> 
<div id="NewlyCreatedSelectBoxes" name="Texty"> 



</div> 
</div> 
</form> 
</body> 
</html>

В этом коде, как только я нажал кнопку, связанную с «вар Select_For_Multiple_Choices» переменной, я shold отображать текстовую форму прямо под кнопкой щелкнутой .. Точно так же всякий раз, когда кнопка текст -box должен быть показан ниже этой кнопки ... Bt в моем коде, хотя он создает текстовое поле, которое показывает aftr все текстовые поля .... Hw Я могу это сделать?Создание Textboxes ниже «вар Select_For_Multiple_Choices» кнопки

источник

2013-09-12 Hiruni

Вы можете использовать .after() для вставки после найденного элемента. Так что-то вроде этого:

$(button).after(content);

источник

2013-09-12 19:34:10 Vlad

$ (Child_Btn + я) .После ("<входной идентификатор = тип 'TxtID' = 'текст' имя = 'textbx []' /> "); Могу ли я поставить параметр кнопки, как это ... Если бы я прикрепил кнопку, которая заканчивается i ... – Hiruni

Попробуйте и посмотрите, что произойдет. – Vlad

Что вы имели в виду под кнопкой? это тег или мне нужно указать его идентификатор или что? – Hiruni

Вы можете получить свой код, чтобы работать, как и ожидалось, передавая контекст выполнения (this) к функции ChildTxtBoxes как: ChildTxtBoxes(this). Вы должны изменить вашу функцию:

function ChildTxtBoxes(button) { 
    var txtBox = "<input type='text' name='textbx[]'/>" 
    $(button).after(txtBox); 
}

Обратите внимание на использование контекста исполнения (this) для идентификации кнопки, которая была нажата и использование .after() вставить текстовое поле после нажатия кнопки, как предложил Влад.

Если честно, я не совсем понимаю ключевое слово this, чтобы объяснить, как и почему он работает. Вы можете прочитать больше на JavaScript “this” keyword here

Here is a working demo

источник

2013-09-18 17:31:45

Создание Textboxes ниже «вар Select_For_Multiple_Choices» кнопки

ответ

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