取消类不submitHandler工作忽略按钮点击

Question

得到这两个图像按钮：

<input type="image" src="images/Update.png" name="btnSubmit" value="Update"/> 
<input type="image" src="images/Cancel.png" value="Cancel" name="btnCancel" class="cancel" onclick="hide_edit_div()" /> 

现在，即使在取消按钮点击运行submithandler。我如何修改它以忽略它？

$(document).ready(function(){ 
    if(this.forms[4]) { 
    $("#editTaskInfo").validate({ 
     rules:{"task_title": {required: true}, 
       "task_instr": {required: true}, 
       "task_desc" : {required: true} 
       }, 
     submitHandler: function(form) { 
     var postData = $('#editTaskInfo').serialize(); 
     $.ajax({type: "POST", 
       url: "post_task.php", 
       data: postData, 
       dataType: "json", 
       success: function(data) { 
        if(textStatus == 'success') { 
        $("div.error span").html(data.msg); 
        $("div.error img").hide(); 
        $("div.error").show(); 
        $("#static_task_price").text(data.price); 
        $("#static_title").text(data.title); 
        $('html, body').animate({scrollTop:0}, 'fast'); 
        hide_edit_div(); 
        $("div.error").fadeOut(10000); 
        } 
       }, 
       error: function(jqXHR, textStatus, errorThrown) { 
        $("div.error span").html(errorThrown); 
        $("div.error img").show(); 
        $("div.error").show(); 
       } 
     }); 
     } 
    } 
    ); 
    } 
}); 

编辑：（因为我不能回答我自己的8个小时，多么愚蠢的限制）

修改的第二个按钮是这样一个div：

<div id="btnCancel" style="float:right; cursor:pointer; width:50px; height:20px; background-image: url(images/Cancel.png); " onclick="hide_edit_div()">&nbsp;</div> 

现在，如果我只能得到它正确定位。 ;-)

Answer 1

广东话您使用简单：

<img src="images/Cancel.png" id="btnCancel" onclick="hide_edit_div()" /> 

Answer 2

使用cancel类只将bypass the validation and will not stop the actual submission。您需要在其他地方处理该部分。可能的解决方法：

1. 更改Cancel按钮的类型，以使其不再触发提交。
2. 触发的形式提交自己，点击相应的按钮，只有当 - 看到JQuery Validate - class="cancel" submit button only stops validation once

Answer 3

改变这样的取消按钮的类型;

<input class="cancel" type="button" id="close" value="Cancel" />