gpt4 book ai didi

javascript - knockout 不会更改对象数组中的复选框状态

转载 作者:行者123 更新时间:2023-11-29 15:43:24 25 4
gpt4 key购买 nike

我正在使用对象数组创建一个复选框选择器,但出于某种原因,当我单击一个复选框时,它会返回默认值。为什么会这样?

 <html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="knockout-2.2.1.js"></script>
<script src="knockout.mapping-latest.js"></script>

</head>
<body>
<span data-bind="text: name"></span>

<ul data-bind="foreach: alldata">
<li>
Name at position <span data-bind="text: $index"> </span>:
<span data-bind="text: $data.name"> </span>
<input type="checkbox" data-bind="attr: { value: $data }, click: myFunction.bind($data),checked: $data.rc " />
</li>
</ul>

<hr />

<div data-bind="text: ko.toJSON(viewModel)"></div>

<script type="text/javascript">

var tObj = {"name":"John", "roles":[{id:1, name:"Role1", desc:"Desc1"}, {id:2, name:"Role2", desc:"Desc2"}]};
var lstRoles=[{id:1, name:"Role1", desc:"Desc1", rc:true},{id:2, name:"Role2", desc:"Desc2", rc:false},{id:2, name:"Role3", desc:"Desc3",rc:true},{id:2, name:"Role4", desc:"Desc4", rc:false}];

var viewModel = ko.mapping.fromJS(tObj);
viewModel.alldata = ko.observableArray(lstRoles);
//viewModel.alldata.subscribe();

ko.applyBindings(viewModel);
function myFunction(data)
{
//viewModel.roles.push(data);
}
</script>
</body>
</html>

更新代码:我已经找到了问题的第一部分,它与点击有关:myFunction.bind($data) 事件如果删除点击事件它开始工作。但仅适用于 tObj.Roles 不适用于 alldata 数组。

 <html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="knockout-2.2.1.js"></script>
<script src="knockout.mapping-latest.js"></script>

</head>
<body>
<span data-bind="text: name"></span>

<div data-bind="foreach: alldata">
<input type="checkbox" data-bind="attr: { value: $data }, checked: $data.rc, enable: $data.ds" />
<span data-bind="text: $data.name"> </span>
<span data-bind="text: $data.desc"> </span></br>

</div>

<hr />

<div data-bind="foreach: roles">
<input type="checkbox" data-bind="attr: { value: $data }, checked: $data.rc" />
<span data-bind="text: $data.name"> </span>
<span data-bind="text: $data.desc"> </span></br>

</div>

<hr />

<div data-bind="text: ko.toJSON(viewModel)"></div>

<script type="text/javascript">

var tObj = {"name":"John", "roles":[{id:1, name:"Role1", desc:"Desc1", rc:true, ds:true},{id:2, name:"Role2", desc:"Desc2", rc:false, ds:false},{id:2, name:"Role3", desc:"Desc3",rc:true, ds:false},{id:2, name:"Role4", desc:"Desc4", rc:false, ds:true}]};
var lstRoles=[{id:1, name:"Role1", desc:"Desc1", rc:true, ds:true},{id:2, name:"Role2", desc:"Desc2", rc:false, ds:false},{id:2, name:"Role3", desc:"Desc3",rc:true, ds:false},{id:2, name:"Role4", desc:"Desc4", rc:false, ds:true}];

var viewModel = ko.mapping.fromJS(tObj);
viewModel.alldata = ko.observableArray(lstRoles);
//viewModel.alldata.subscribe();

ko.applyBindings(viewModel);
function myFunction(data)
{
//viewModel.roles.push(data);
}
</script>
</body>
</html>

最佳答案

合理的,它与默认点击操作有关,即复选框值更改。尝试使用 return true;来自点击处理程序。

关于javascript - knockout 不会更改对象数组中的复选框状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15566547/

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