ساختن اینپوت با جاوا اسکریپت
سلام دوستان من این شکلی بصورت جاوا اسکریپت خام با زدن روی دکمه سه تا اینپوت با سه تا نام مختلف میسازم این کد بهینه نیست چطوری میتونم کد بخش جاوا اسکریپت رو بصورتی هندل کنم که فقط یکبار بنویسمش ولی با زدن روی دکمه سه تا اینپوت با سه اسم و ایدی و 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>
گزینش سوالات
گفت و گو های مرتبط
دسته بندی سوالات
تگ‌های محبوب
ثبت پرسش جدید
![user-avatar]()
گزارش تخلف
کپی کردن
0
روش من که اینه که البته به نظرم اصولی هم هست.
<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>اگه مفید بود بهترین پاسخ رو بزنید که بشه اولیم :)
مهرداد
@mehrdadroshanraee69
2 سال پیش
مطرح شد
گزارش تخلف
کپی کردن
0
والا جواب داد ممنون اگه دوستان روش بهتری هم داشته باشن عالی میشه اما چون جواب داد بهترین پاسخ مال شما