How to make INPUT TYPE = "IMAGE" not send to Enter in WebKit?

Question

In a C # / ASP.NET application, I have a form that looks like the following (plus a lot more, but this is important):

<form method="post" action="">
<input type="image" name="ctl15" src="cancel.gif" style="border-width:0px;" />
    <!-- Server side, the above input is a System.Web.UI.WebControls.ImageButton. -->
...more extra fluff...
<input type="submit" name="Button1" value="Proceed" id="Button1" class="button"
    style="width:59px;" />
</form>

This form works fine in Internet Explorer and Firefox, but it doesn’t work in WebKit-based browsers (Safari and Chrome). The problem is that when the user presses Enter, when instead of using the mouse to press the submit button, the image input is activated (which in this case corresponds to the cancel event, exactly the opposite of the “continue" "action, which is natural given the user interface in question).

I want to do this by pressing the Enter key, activate the button <input type="submit">instead <input type="image">, without breaking the submission, by clicking on the image. How can i do this? Preferred in the browser, so I don’t need even more special cases in the code.

There are no jQuery solutions, please, since this application does not use it (and introducing a whole new library for such a “simple” thing will be a very difficult sale), however, JavaScript is great. Obviously, it would be best if it could only be done in HTML and CSS, but I have doubts about the possibility of this.

In fact, this question seems to me like the opposite of HTML: submitting a form by clicking a button without a submit button .

, .aspx( , <input type="image"> , <input type="submit"> - ), HTML .

Answer 1

JavaScript:

<script type="text/javascript">
var SUBMIT_BUTTON_ID = "Button1";
window.onload = function(event) {
    var arrInputs = document.getElementsByTagName("input");
    for (var i = 0; i < arrInputs.length; i++) {
        var oCurInput = arrInputs[i];
        if (oCurInput.type == "text") {
            oCurInput.onkeypress = function(evt) {
                if (typeof evt == "undefined" || evt == null)
                    evt = window.event;
                var keyCode = evt.keyCode || evt.which;
                if (keyCode == 13) {
                    document.getElementById(SUBMIT_BUTTON_ID).click();
                    return false;
                }
                return true;
            }
        }
    }
}
</script>

IE8 Chrome, , , .

onkeypress ENTER , .