Jquery停止按钮从post返回

我有一些Jquery正在进行验证。验证目前正在运行，因为它位于一个刚刚运行的匿名函数中

当用户单击save按钮并且验证失败时，我希望页面不要发回，也不要重新加载（这样验证消息就不会消失）

当前，即使我正在执行e.preventDefault（）并且正在丢失验证消息，页面仍在发回。你知道我该如何阻止页面发回吗

代码如下：

<script type="text/javascript">
    $(function () {

        $(".dateTimePickerField").kendoDateTimePicker({
            min: new Date(1950, 0, 1),
            max: new Date(2049, 11, 31),
            value: new Date(2000, 10, 1),
            interval: 15
        });

        var validator = $(".dateTimePickerField").kendoValidator({
            rules: {
                dateValidation: function (e) {
                    var currentDate = Date.parse($(e).val());
                    if (!currentDate) {
                        return false;
                    }
                    return true;
                }
            },
            messages: {
                //Define your custom validation massages
                required: "datetime required",
                dateValidation: "Invalid datetime"
            }
        }).data("kendoValidator");

        $('#bttnSaveGuru').click(function (e) {
            if (!validator.validate()) {
                e.preventDefault();
                e.stopPropagation();
            }
        });
    });
</script>



<button runat="server" id="bttnSaveGuru" class="saveButton" type="button" clientidmode="Static">Save</button>
<tr>
    <td runat="server" id="tdDate"></td>
    <td runat="server" id="tdDescription"></td>
    <td runat="server" id="tdLocation"></td>
    <td><input type="text" runat="server" id="txtDate" class="dateTimePickerField" style="width:180px;margin-right:55px;" required="required"/></td>
    <td><input type="text" runat="server" id="txtDateEnd" class="dateTimePickerField" style="width:180px;margin-right:55px;" required="required"/></td>
</tr>

$（函数（）{
$（“.dateTimePickerField”）.kendoDateTimePicker({
最小值：新日期（1950,0,1），
最大值：新日期（2049年11月31日），
价值：新日期（2000年10月1日），
间隔时间：15
});
var验证器=$（“.dateTimePickerField”）.kendoValidator({
规则：{
日期验证：函数（e）{
var currentDate=Date.parse（$（e）.val（））；
如果（！currentDate）{
返回false；
}
返回true；
}
},
信息：{
//定义自定义验证消息
必需：“需要日期时间”，
dateValidation:“无效的日期时间”
}
}).数据（“kendoValidator”）；
$（'bttnSaveGuru'）。单击（函数（e）{
如果（！validator.validate（））{
e、 预防默认值（）；
e、 停止传播（）；
}
});
});
拯救

向我建议的解决方案是在按钮的onclick属性中运行验证，如下所示

 <button runat="server" id="bttnSaveGuru" class="saveButton" type="button" clientidmode="Static" onclick="if(!checkValidation()){return false;}">Save</button>

保存

---

这实际上阻止了页面发回，但它需要在按钮上使用内联代码，如果可以的话，我宁愿在匿名函数中阻止页面发回。

是否检查了是否确实输入了单击句柄？ 如果是，你能试试吗

$('#bttnSaveGuru').click(function (e) {
  e.preventDefault();
  if (validator.validate()) {
    //manually trigger submit
  }
});

---

由于javascript是异步的，因此在运行验证时会激活按钮操作。防止默认值直接点击，验证，然后如果它是有效的

    $('#bttnSaveGuru').click(function (e) {
        e.preventDefault();
        e.stopPropagation();
        if (!validator.validate()) {
            //send here
        }
    });

---

我和一些同事谈过，得出了以下结论

因为这是一个asp.net服务器端按钮，所以它总是在onclick事件中获取doPostback。无论我在匿名函数中添加什么来防止回发，它都不起作用

看起来防止像这样在服务器端按钮上发回的唯一方法是从button OnClick或OnClientClick属性本身返回false。至少这是我正在经历的，所以我将要采用的解决方案

匿名javascript函数代码似乎只是附加到onclick事件中，但它并不阻止在onclick事件中自动生成的dopostback

<button runat="server" id="bttnSaveGuru" class="saveButton" type="button" clientidmode="Static" onclientclick="if(!checkValidation()){return false;}">Save</button>

保存

你能把一个工作的JSFIDLE放在一起吗？什么是validator.validate（）？它似乎没有被定义…这可能是e.preventDefault没有停止重新加载页面以获得简单的JSFIDLE的原因，但它没有弹出警报。不确定是否将原始html输出放入html部分，或将html放入该部分的我的aspx页面。这是右边的链接，提琴不工作，因为kendoValidator和kendoDateTimePicker未定义。我正在输入它，我已经尝试了警报（1）；它是有效的。当我查看源代码时，按钮本身看起来像这样。Save您是否尝试将preventDefault作为处理程序的第一行，以便它正确地停止默认行为，如果表单正确，则触发手动发送？正如您所看到的，由于它是一个runat server按钮，因此它得到了一个自动连线的doPostBack。除了在按钮的实际onclick属性内，无法找到阻止它发回的方法。我的错，没有仔细阅读您的答案。。。哪个框架正在生成onclick事件？更好的是，您能编写一个JSFIDLE来重现您的问题吗？是的，您的FIDLE无法工作，因为所有这些行为都是由ASP.net引起的。我不是这个框架的专家，但我通过快速检查发现了这一点：似乎有些事件可以用来拦截单击操作（onClientClick），或者可以直接在表单上的提交事件级别完成。因此我尝试了这一点，回发仍在进行中。我想知道这里是否有未知变量，因为每个人都说它和你说的一样简单。