Differences between type=“image” and type=“submit”?

问题

(This question is related to this question)

I've a simple form:

<html>
<head>
</head>
<body>
    <form name="aspnetForm" method="post" action="http://www.startupseeds.com/Default.aspx">
        <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="..." />
        <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWCALMyNWrBQKoz5H1CALlmOb9DgKmz6HzAwKf8bOXCQKC7qLKAwK5kNvVAQKk7amsA53tGBGr+Ji7LTI0eYkvquMZrF/g" />
        <input name="ctl00$Login1$tbEmail" type="text" />
        <input name="ctl00$Login1$tbPassword" type="password" />

        <input type="image" name="ctl00$Login1$ibLogin" />
    </form>
</body>
</html>

When I Change this:

<input type="image" name="ctl00$Login1$ibLogin" />

to this:

<input type="submit" name="ctl00$Login1$ibLogin" />

...it doesn't work. The only difference in this code is type="submit" instead of type="image". I didn't know even that there are differences between them (in the key/value in http) - How can I get "submit" to work?

Thank you.

回答1:

The difference is that:

<input type="image" name="ctl00$Login1$ibLogin" />

will result in two form fields: ctl00$Login1$ibLogin.x and ctl00$Login1$ibLogin.y to indicate what part of the image was clicked, although you have no image in your markup.

From 17.4.1 Control types created with INPUT of the HTML 4.01 Specification:

image

Creates a graphical submit button. The value of the src attribute specifies the URI of the image that will decorate the button. For accessibility reasons, authors should provide alternate text for the image via the alt attribute.

When a pointing device is used to click on the image, the form is submitted and the click coordinates passed to the server. The x value is measured in pixels from the left of the image, and the y value in pixels from the top of the image. The submitted data includes name.x=x-value and name.y=y-value where "name" is the value of the name attribute, and x-value and y-value are the x and y coordinate values, respectively.

回答2:

I suspect you'd like an asp.net page like this:

<form id="form1" runat="server" action="http://www.startupseeds.com/Default.aspx">
<div>
    <asp:TextBox ID="tbTextBox" runat="server" />
    <asp:TextBox ID="tbPassWord" runat="server" TextMode="Password" />
    <asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</div>
</form>

However, it depends on your target site if this kind of http-post actions are allowed.

回答3:

Most likely your backend code is checking for the existence of an ibLogin.x or ibLogin.y POST parameters which are sent when you click an <input type="image"> and represent the coordinates of the click. An <input type="submit">, on the other hand, will post an ibLogin parameter.

回答4:

need the src attribute that point a image url...

<input type="image" src="image_url" name="ctl00$Login1$ibLogin" />

EDIT:http://www.w3schools.com/TAGS/att_input_type.asp

defines an image as a submit button.

The src and alt attribute are required with .

回答5:

A submit button created using is rather a drab looking gray colored entity, unless you know style sheets. while By placing input type=image in place of input type=submit you can place an image in place of the default submit button. as example shown

< input type="image" src="images/submit.jpg" value="Submit" alt="Submit" >

来源：https://stackoverflow.com/questions/2082005/differences-between-type-image-and-type-submit

标签

html

http

forms