Kendo Checkbox 检查事件
Posted
技术标签:
【中文标题】Kendo Checkbox 检查事件【英文标题】:Kendo Checkbox check event 【发布时间】:2018-10-01 01:44:30 【问题描述】:我正在尝试捕捉 kendo 复选框事件,但我无法让它工作。我确定我错过了一些东西。因为我在这个简单的事情上花了一个多小时,我很累。以下是代码sn-p。
<div class="bottomPadding row">
<div class="col-md-4 col-sm-4 col-xs-12 col">
<label>Send Activation Link</label>
</div>
<div class="col-md-6 col-sm-6 col-xs-12 col">
<input id="sendLink" type="checkbox" data-bind="checked: Account.IsLink" />
</div>
</div>
还有JS代码,
$("#sendLink").click(function ()
if (this.checked)
console.log("hit");
);
请纠正我在哪里搞砸了。
P.S:我参考了一些 SO 答案,有些没有答案,有些答案在我的情况下不起作用。
【问题讨论】:
您的示例不包含任何 KENDO...如果您真的使用 Kendo - 请参见此处:demos.telerik.com/kendo-ui/grid/checkbox-selection 如果你不喜欢剑道,看这里:***.com/questions/7031226/… 整个页面都在剑道中,因此我需要一个剑道复选框 @Gerfried 说的是真的。发布您的整个代码 - 最好是在 dojo.telerik.com 中的演示 - 因为您添加的代码应该可以正常工作,check this 【参考方案1】:我已经在我的机器上运行了你的代码并且收到了点击事件,这是我的代码:
<div class="row">
<div class="col-md-4 col-sm-4 col-xs-12 col">
<label>Send Activation Link</label>
</div>
<div class="col-md-6 col-sm-6 col-xs-12 col">
<input id="sendLink" type="checkbox" data-bind="checked: Account.IsLink" />
</div>
</div>
<script>
$(document).ready(function ()
clickHookup();
)
</script>
在我的 JS 文件中:
function clickHookup()
$("#sendLink").click(function ()
if (this.checked)
console.log("hit");
);
【讨论】:
你没有包括剑道,是吗? @JohnLord 是的,你是对的,我将删除我的评论以避免任何未来的混乱,谢谢!【参考方案2】:上面的代码工作正常,但这不是剑道。它是纯 jQuery。要使用剑道,请检查这里
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<link href="https://da7xgjtj801h2.cloudfront.net/2015.2.624/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="https://da7xgjtj801h2.cloudfront.net/2015.2.624/styles/kendo.silver.min.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://da7xgjtj801h2.cloudfront.net/2015.2.624/js/kendo.ui.core.min.js"></script>
<title>JS Bin</title>
</head>
<body>
<div class="bottomPadding row">
<div class="col-md-4 col-sm-4 col-xs-12 col">
<label>Send Activation Link</label>
</div>
<div class="col-md-6 col-sm-6 col-xs-12 col">
<input id="sendLink" type="checkbox" data-bind="checked: Account.IsLink" />
</div>
<div class="col-md-4 col-sm-4 col-xs-12 col">
<label>Copy Activation Link</label>
</div>
<div class="col-md-6 col-sm-6 col-xs-12 col">
<input id="sendLinkCopy" type="checkbox" data-bind="checked: Account.IsLink" />
</div>
</div>
<script>
$("#sendLink").click(function ()
if (this.checked)
console.log("hit");
);
var viewModel = kendo.observable(
Account:
IsLink: false
);
kendo.bind($("#sendLink"), viewModel);
kendo.bind($("#sendLinkCopy"), viewModel);
</script>
</body>
</html>
请注意,sendLinkCopy 会根据 sendLink 复选框中的更改进行更新。它由剑道处理。
【讨论】:
以上是关于Kendo Checkbox 检查事件的主要内容,如果未能解决你的问题,请参考以下文章