Question

我一直在测试我之前制作的一个简单（HTML5 / jQuery）应用程序，用户在文本框中输入消息，当单击按钮时，此消息被视为警报。问题是，每次单击该按钮时，数据点击属性似乎都会触发两次，因为消息会被警告两次。

我目前正在使用Kendo UI版本2012.3.1114以及jQuery 1.8.2 **我也尝试过使用jQuery 1.8.3并得到相同的结果，但是当使用较旧版本的Kendo时一切正常

有人可以帮帮我吗？!!!

更新：这是我的代码 **顺便说一句我正在使用ripple模拟器来测试这个应用程序，甚至在iPad上尝试使用相同的结果

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="js/jquery.min.js"></script>
    <script src="js/kendo.all.min.js"></script>
    <link href="styles/kendo.common.min.css" rel="stylesheet" />
    <link href="styles/kendo.default.min.css" rel="stylesheet" />   
    <link href="styles/kendo.mobile.all.min.css" rel="stylesheet" />
</head>
<body>
<div data-role="view" id="mainView">
    <br/>
    <center><a data-role="button" data-click="showAlert">Click Me</a></center>
    <br/>
</div>
<script>
    function showAlert(){
        alert("Clicked!!!");
    }
</script>
<script>
    var app = new kendo.mobile.Application(document.body);
</script>
</body>
</html>

Answer 1

当使用Kendo UI进行MVC时，我发生了同样的事情。在Kendo UI按钮定义中我有：

 @(Html.Kendo().Button().Name("showFirstGraphButton")
 .Tag("button")
 .Content("Submit Selection")
 .HtmlAttributes(new { id = "showFirstGraphButton" })
 .Events(ev => ev.Click("showFirstGraphButtonOnClick")))

在我写的事件处理函数中。

function showFirstGraphButtonOnClick(e) {
e.preventDefault();
e.event.preventDefault(); 
.....  
}

它对我有用，我确实验证了表单然后只是使用jquery提交它，如果每次验证都通过了。

Answer 2

我刚创建了一个简单的移动页面。添加文本框和按钮。按钮单击执行文本框内容的警报。我没有两次得到警报。看看下面的代码：

<!DOCTYPE html>
<html>
<head>
    <title>Events</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" >
    <script src="../../../js/jquery.min.js"></script>
    <script src="../../../js/kendo.mobile.min.js"></script>
    <script src="../../content/shared/js/console.js"></script>
    <link href="../../../styles/kendo.common.min.css" rel="stylesheet" />
    <link href="../../../styles/kendo.mobile.all.min.css" rel="stylesheet" />
</head>
<body>
    <a href="../index.html">Back</a>
    <div data-role="view" id="button-events" data-title="Button Events">
        <input id="txtMessage" style="display: block; margin: 2em; text-align: center;width:280px"/>
        <a id="mobile-button3" data-click="showAlert" data-role="button" style="display: block; margin: 2em; text-align: center;">Show Alert</a>
    </div>
    <script>
        function showAlert(e) 
        {
            alert($("#txtMessage").val())
        }
    </script>
    <script>
        window.kendoMobileApplication = new kendo.mobile.Application(document.body);
    </script>
</body>
</html>

您可以粘贴代码 - 以便我们可以调试吗？

Answer 3

我意识到这是一个老问题，但只是为了在有人来看时给出答案。我遇到了同样的问题，在我的函数中返回false为我解决了这个问题。

Kendo UI Mobile Button数据点击两次点击

3 个答案: