如何在调用方法时将选中的属性添加到动态添加的输入(复选框)
在调用方法时将选中的属性添加到动态添加的输入（复选框），可以通过以下步骤实现：
- 创建一个包含所有属性的对象或数组，用于存储选中的属性值。
- 在页面中动态生成复选框元素，并为每个属性设置一个唯一的标识符（ID）。
- 使用JavaScript监听复选框的状态变化事件，当复选框被选中或取消选中时触发相应的事件处理函数。
- 在事件处理函数中，判断复选框的状态，如果被选中，则将对应的属性值添加到属性对象或数组中；如果取消选中，则从属性对象或数组中移除对应的属性值。
- 在调用方法时，将属性对象或数组作为参数传递给方法，以便使用选中的属性值。
以下是一个示例代码：
<!DOCTYPE html>
<html>
<head>
<title>动态添加复选框</title>
</head>
<body>
<div id="checkboxContainer">
<!-- 动态生成的复选框将添加到这里 -->
</div>
<button onclick="callMethod()">调用方法</button>
<script>
// 属性对象，用于存储选中的属性值
var selectedProperties = {};
// 属性列表，用于生成复选框
var properties = [
{ id: 'property1', name: '属性1' },
{ id: 'property2', name: '属性2' },
{ id: 'property3', name: '属性3' }
];
// 动态生成复选框
var checkboxContainer = document.getElementById('checkboxContainer');
properties.forEach(function(property) {
var checkbox = document.createElement('input');
checkbox.type = 'checkbox';
checkbox.id = property.id;
checkboxContainer.appendChild(checkbox);
var label = document.createElement('label');
label.htmlFor = property.id;
label.appendChild(document.createTextNode(property.name));
checkboxContainer.appendChild(label);
});
// 监听复选框状态变化事件
checkboxContainer.addEventListener('change', function(event) {
var checkbox = event.target;
var propertyId = checkbox.id;
if (checkbox.checked) {
// 复选框被选中时，将属性值添加到属性对象中
selectedProperties[propertyId] = true;
} else {
// 复选框取消选中时，从属性对象中移除属性值
delete selectedProperties[propertyId];
}
});
// 调用方法时传递选中的属性对象
function callMethod() {
// 在这里调用方法，并将selectedProperties作为参数传递
console.log(selectedProperties);
}
</script>
</body>
</html>在上述示例中，我们首先定义了一个属性列表（properties），其中包含了三个属性。然后，通过JavaScript动态生成了对应的复选框，并为每个复选框设置了唯一的ID。接着，我们监听了复选框的状态变化事件，并在事件处理函数中根据复选框的状态，将选中的属性值添加到属性对象（selectedProperties）中或从中移除。最后，在调用方法时，我们将属性对象作为参数传递给方法。
请注意，上述示例中的代码仅为演示目的，实际应用中可能需要根据具体需求进行适当的修改和扩展。
相关·内容
3回答
调用作为属性的函数
jquery、function
是否可以调用作为属性的方法？我的意思是，我有这个输入(这是使用jQuery动态创建的，也是在使用.get()检索公司列表时创建的)：
<input type="checkbox" onclick="javascript:onWorksiteChecked，我获得了每个输入都需要运行的javascript (将其添加到列表中并<e
浏览 10提问于2009-09-09得票数 0
回答已采纳
3回答
如何在使用asp.net创建的Java脚本中找到动态控件
c#、javascript、asp.net、dynamic
首先，我将复选框创建为然后 txtDynamic.ID= "txtDynamic";现在我需要的..。选中复选框时<
浏览 4提问于2010-10-25得票数 1
回答已采纳
1回答
来自我的html： <a href="#" id="scanCompleteBtn" class="btn btn-scan-nonactive">Scan To Complete </a> 我在此方法
浏览 5提问于2021-03-25得票数 0
3回答
向动态创建的复选框jQuery添加验证
javascript、jquery、html、validation、checkbox
我正在处理动态表单，即收音机，复选框是动态添加的。不幸的是，我坚持添加验证。});
浏览 6提问于2017-01-25得票数 0
回答已采纳
1回答
哪个事件用于在加载pdf表单时将javascript方法添加到复选框？
javascript、acrobat
我的应用程序中有一个可编辑的Pdf表单。在该表单中，我添加了一个复选框。在checkbox鼠标释放事件中，我添加了一个javascript，用于在选中复选框时将按钮的只读属性设置为false，而在取消选中复选框时将按钮的只读属性设置为true。我的问题是，当我在Adobe阅读
浏览 0提问于2018-06-29得票数 0
3回答
在jquery mobile中动态创建的复选框不起作用
jquery、jquery-mobile
ui-btn-icon-left ui-checkbox-off ui-last-child">Reminder</label>我在运行时通过jquery生成了上面的css和input复选框，但是我的复选框没有选中“有人能帮我吗”。我已经使用jquery mobile和尝试了所有的方法
浏览 1提问于2014-07-01得票数 1
2回答
使用jQuery动态地用隐藏字段替换复选框
javascript、php、jquery、html、checkbox
由于复选框只在选中内容时才发送内容，但我的服务器端脚本需要其中的ala (值为'Y‘或’N‘的选中和未选中字段)，因此需要用相同名称的隐藏输入字段动态替换复选框表单字段(它们的功能)。因此，我需要jQuery脚本，它将完成以下工作；
对于我页面上的每个复选框输入字段，它应该以与复选框</e
浏览 1提问于2014-09-15得票数 0
回答已采纳
1回答
Vuejs动态参考文献未定义
vuejs2、ref
我有来自项目列表的动态输入列表： <li v-for="item in items"> :value="item.，我希望动态地将:ref绑定到item.，我将添加到itemsChecked数组中。接下来，在mounted()方法中，我希望循环检查数组中的项，并使用它们<e
浏览 4提问于2018-06-02得票数 0
3回答
FormData和复选框
javascript
目前，在创建FormData对象时，会添加一个选中的复选框，值为"on"，而不会通过一个未选中的复选框。我是否必须修改一些隐藏的输入才能正确地设置复选框，或者是否可以使用FormData或预处理进行一些自定义？
我希望选中的复选框是1，而未选中的复选框是0。我已经可以自己做
浏览 0提问于2015-11-03得票数 16
回答已采纳
5回答
点击jquery添加属性'checked‘
javascript、jquery、html、local-storage
我一直在试图弄清楚如何在单击时将“选中”属性添加到复选框中。我想这样做的原因是，如果我选中一个复选框，我可以让我的本地存储将其保存为html，这样当页面刷新时，它会注意到复选框被选中。从现在起，如果我选中它，它会淡出父级，但如果我保存并重新加载它，它将保持淡入淡出状态，但复选框未选中。
我试过
浏览 0提问于2010-08-05得票数 25
回答已采纳
5回答
如何在installshield中初始化复选框值
installshield
如何在InstallShield 2010中设置复选框(选中/未选中)的初始值。当我运行installer时，I
浏览 0提问于2011-07-30得票数 5
回答已采纳
5回答
在jquery中添加“checked”属性到复选框中
javascript、jquery、html、checkbox
因此，我在实际设置复选框时没有问题，但是在我当前的例子中，我需要将“选中”属性实际添加到复选框中，因为我所工作的系统实际上是从DOM抓取HTML。我可以将复选框设置为要选中，但是，当HTML再次插入时，没有标识的“选中”属性，因此它不保存属性，因此所有复选框都未选中:(
是否有一种方法
浏览 8提问于2015-02-19得票数 2
回答已采纳
1回答
Flex Viewstack动态下一步和后退按钮
apache-flex、air、adobe
我正在尝试创建一个向导，它将引导用户通过我构建的许多单独的容器。我有一个主页，其中有许多复选框供用户使用，每个复选框都绑定到一个容器。我希望发生的情况是，一旦单击复选框就会使该容器可见，然后单击“下一步”和“后退”按钮只会转到下一个可见的容器；从而使未在主页上选中的任何容器从向导中消失。任何想法，我已经找过很多地方了。
浏览 1提问于2010-11-18得票数 0
2回答
Javascript regex条件不带eval？
javascript、jquery、regex、filtering、eval
我正在将多组复选框筛选(多个无序的复选框列表)添加到web应用程序中，并且我一直试图使用eval (或者在这种情况下我不应该担心？)基本上，数据是用一个AJAX调用来调用的，我将其存储在一个对象数组中，并且在不进行额外AJAX调用的情况下进行实时过滤。选中复选框时，我使用的是.match()，基本上是将正则表达式创建为数组中<e
浏览 2提问于2014-05-17得票数 0
回答已采纳
3回答
使用jquery动态添加复选框(当用户单击Select All复选框时显示选中)
javascript、jquery、checkbox
当页面加载时，有10个复选框。当我单击Select all复选框时，所有10个复选框都会被选中。现在，我使用复选框(页面上共有20个复选框)动态添加了另外10条记录(使用ajax)。现在我点击Select All复选框，原来的复选框，即前10个复选框被取消选中(新添加的10个是原样，即未<em
浏览 6提问于2015-07-14得票数 0
3回答
用于将点击行为绑定到匹配元素集合的jQuery
jquery
我想为我的每个checkbox输入添加一个选中处理程序，以便当它们的值被更改(通过直接单击它们或通过单击通过“checked=”属性绑定到它们的标签)时，将一个名为"selected“的类添加到父li元素中相反，当单击事件取消选中复选框时，我希望从li元素中删除"selected“类。label for="my_ad
浏览 0提问于2011-07-15得票数 0
回答已采纳
3回答
jquery在.remove()之后清除div中的空格
javascript、jquery、ajax、jsp、checkbox
复选框动态地添加到div1中：在选择这些选项时，复选框将动态添加到<
浏览 0提问于2013-11-27得票数 0
回答已采纳
2回答
将JSON反序列化为C# -复选框中的值
c#、json、web-services
TargetType { get; set; } public List<string> Tags { get; set; }下面是正在调用的方法标记属性已成功填充。但是，如果选中的项少于两项，则会出现转换错误。序列化程序不能将单个字符串值转换为列表对象。下面是用选中的一个复选框发送JSON的方式：{&quo
浏览 4提问于2017-03-31得票数 0
回答已采纳
2回答
复选框元素的复选属性何时添加到DOM？
javascript、html、css、checkbox
我需要将选中的所有复选框涂成绿色，而未选中的复选框则显示为红色。label> <span>I have a car</span>页面加载时看起来很好但是后来，当用户单击任何复选框时，它们
浏览 2提问于2013-08-06得票数 2
回答已采纳
1回答
更改状态时复选框元素的怪癖
html
我对HTML并不陌生，但我总是停留在输入元素上，下面是一些html：<div><input id="secondInput"type="checkbox" /></div>let firstInput = document.getElementById('first
浏览 0提问于2019-11-01得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
活动推荐
腾讯云开发者
