سلام دوستان من این شکلی بصورت جاوا اسکریپت خام با زدن روی دکمه سه تا اینپوت با سه تا نام مختلف میسازم این کد بهینه نیست چطوری میتونم کد بخش جاوا اسکریپت رو بصورتی هندل کنم که فقط یکبار بنویسمش ولی با زدن روی دکمه سه تا اینپوت با سه اسم و ایدی و placeholder و کلا با اون مشخصات که نوشتم ایجاد بشه
function createInput(){
let inputs = document.createElement(html)
inputs.setAttribute('lable' , 'Attribute');
inputs.setAttribute('type' , 'text');
inputs.setAttribute('id' , 'attributes');
inputs.setAttribute('class' , 'form-control');
inputs.setAttribute('name' , 'attributes[]');
inputs.setAttribute('placeholder' , 'attribute ...');
document.querySelector('#input1').append(inputs)
let inputs2 = document.createElement('INPUT');
inputs2.setAttribute('type' , 'text');
inputs2.setAttribute('id' , 'values');
inputs2.setAttribute('class' , 'form-control');
inputs2.setAttribute('name' , 'values[]');
inputs2.setAttribute('placeholder' , 'value ...');
document.querySelector('#input2').appendChild(inputs2)
let inputs3 = document.createElement('INPUT');
inputs3.setAttribute('type' , 'text');
inputs3.setAttribute('id' , 'units');
inputs3.setAttribute('class' , 'form-control');
inputs3.setAttribute('name' , 'units[]');
inputs3.setAttribute('placeholder' , 'unit ...');
document.querySelector('#input3').appendChild(inputs3)
}
<button class="btn btn-success" type="button" onclick="createInput()">Add Attribute</button>
روش من که اینه که البته به نظرم اصولی هم هست.
<button onclick="createInput()">click me!!</button>
<div id="input1"></div>
<div id="input2"></div>
<div id="input3"></div>
<script>
var inputsData = [
{id:'attributes', placeholder:'attribute ...', _name: 'attributes[]'},
{id:'values', placeholder:'value ...', _name: 'values[]'},
{id:'units', placeholder:'unit ...', _name: 'units[]'}
]
function createInput(){
for(var i = 0 ; i < 3 ; i++) {
let inputs = document.createElement('input')
inputs.setAttribute('type' , 'text');
inputs.setAttribute('id' , inputsData[i].id);
inputs.setAttribute('class' , 'form-control');
inputs.setAttribute('name' , inputsData[i]._name);
inputs.setAttribute('placeholder' , inputsData[i].placeholder);
document.querySelector('#input' + String(i+1) ).append(inputs)
}
}
</script>
اگه مفید بود بهترین پاسخ رو بزنید که بشه اولیم :)
والا جواب داد ممنون اگه دوستان روش بهتری هم داشته باشن عالی میشه اما چون جواب داد بهترین پاسخ مال شما
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟