gpt4 book ai didi

javascript - 如何根据文本框值添加多个输入字段?

转载 作者:行者123 更新时间:2023-12-02 19:45:56 24 4
gpt4 key购买 nike

我创建了一个工作正常的添加输入字段函数。我想根据输入字段编号添加许多输入字段。不幸的是,我刚刚开始找不到正确的结果。这是我的 JQ 代码

$(document).ready(function() {
var scntDiv = $('#add_words');
var wordscount = 1;
var i = $('.line').size() + 1;

$('#add').click(function() {
var v = $("#inputs").val();
alert(v);
wordscount++;
$('<div class="line">Word is ' + wordscount + '<input type="text" value="' + wordscount + '" /><a class="remScnt" href="#">Remove</a></div>').appendTo(scntDiv);
i++;
return false;
});

// Remove button
$('#add_words').on('click', '.remScnt', function() {
if (i > 1) {
$(this).parent().remove();
i--;
}
return false;
});
});

还有 HTML 代码

<select id="inputs" style="width:60px;">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
<a id="add" href="#">Add</a>
<div id="add_words"></div>

实际上,我需要根据我们在 id="inputs 中选择的数量来添加输入字段。

最佳答案

像这样:

$(document).ready(function() {
var scntDiv = $('#add_words');
var wordscount = 1;
var i = $('.line').size() + 1;

$('#add').click(function() {
var inputFields = parseInt($('#inputs').val());
for (var n = i; n < inputFields; ++ n){
wordscount++;
$('<div class="line">Word is ' + wordscount + '<input type="text" value="' + wordscount + '" /><a class="remScnt" href="#">Remove</a></div>').appendTo(scntDiv);
i++;
}
return false;
});

// Remove button
$('#add_words').on('click', '.remScnt', function() {
if (i > 1) {
$(this).parent().remove();
i--;
}
return false;
});
});

在这里查看它的实际效果: http://jsfiddle.net/zLG7c/6/

关于javascript - 如何根据文本框值添加多个输入字段?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9871253/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com