Question

我有一个html表单，我想要2个按钮。当用户点击一个按钮时，它会提交一个值（如），当他们点击另一个按钮时，它会提交另一个值（不喜欢）。

我能够通过以下脚本实现这一目标：

<input type=”submit” name=”rating” value=”like” />
<input type=”submit” name=”rating” value=”dislike” />

现在我要做的是用漂亮的图像替换2个默认提交按钮（灰色框）。我正在尝试：

<input type=”image” name=”rating” value=”like” src=”pic1.png” alt=”submit”   />
<input type=”image” name=”rating” value=”dislike” src=”pic2.png” alt=”submit” />

问题是我指定的值（比如/不喜欢）不再提交了...有没有办法解决这个问题？感谢。

Answer 1

使用CSS

input {
background-image: url('http://www.clker.com/cliparts/3/P/l/W/c/E/orange-rectangle-button-hi.png');
}

<input type="submit" name="rating" value="like" />
<input type="submit" name="rating" value="dislike" />

或者您可以在输入中包含syle：

<input style="background-image: url('http://www.clker.com/cliparts/3/P/l/W/c/E/orange-rectangle-button-hi.png');" type="submit" name="rating" value="like" />
<input style="background-image: url('http://www.clker.com/cliparts/3/P/l/W/c/E/orange-rectangle-button-hi.png');" type="submit" name="rating" value="dislike" />

带有2个IMAGE提交按钮的HTML表单

1 个答案: