我是jQuery和JavaScript的新手。
设法使以下代码工作,根据用户从(先前的)下拉选择字段中选择的编号添加新的文本输入字段。
<script>
$(function() {
var input = $('<input placeholder="输入名称或标题..." type="text" required/>');
var newFields = $('');
$('#qty').bind('blur keyup change', function() {
var n = this.value || 0;
if (n + 1) {
if (n > newFields.length) {
addFields(n);
} else {
removeFields(n);
}
}
});
function addFields(n) {
for (i = newFields.length; i < n; i++) {
var newInput = input.clone();
newFields = newFields.add(newInput);
newInput.appendTo('#newFields');
}
}
function removeFields(n) {
var removeField = newFields.slice(n).remove();
newFields = newFields.not(removeField);
}
});
</script>
然而,在<input placeholder="输入主题或标题..." type="text" required/>中,我想为每个添加的字段添加两个属性/参数:
name="subject1", name="subject2"等等,对于每个输入字段例如,第一个字段的输出输入标签应为<input placeholder="输入主题或标题..." type="text" name="subject1" required/>
<input>标签之前
例如,第一个字段的输出输入标签应为“Subject 1: <input placeholder="输入主题或标题..." type="text" name="subject1" required/>”请问如何实现这个功能?
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
这是一种添加主题标题和名称属性的方法。
您可以使用字符串连接来实现,使用变量
i。$(function() { $('#qty').bind('blur keyup change', function() { var n = this.value || 0; createFields(n) }); function createFields(n) { $("#newFields").empty(); //清空字段列表 for (var i = 1; i <= n; i++) { var fieldWrapper = $('<div class="fieldwrapper"/>'); //创建包装器 var name = $("<p>主题 " + i + "</p>"); //创建主题标题 var input = $('<input name="Subject' + i + '" placeholder="输入名称或标题..." type="text" required />'); //创建输入框 fieldWrapper.append(name); //添加标题 fieldWrapper.append(input); //添加输入框 $("#newFields").append(fieldWrapper); //添加到列表中 } } });