输入类型=“图像”vs类型=“提交”

时间:2009-09-29 02:02:20

标签: html coldfusion

我编程了很长时间检查StructKeyExists(表单,“更新”),直到我将输入从type =“submit”更改为type =“image”。当type =“image”时,IE不会发回控件的名称,而是发送Update.X和Update.Y。

<form method="post">
Old Way:<br />
<input type="submit" value="3" name="Update" /><br />
<input type="submit" value="4" name="Delete" />
<p>New Way:</p>
<input type="image" value="1" name="Update" src="http://www.google.com/intl/en_ALL/images/logo.gif" /><br />
<input type="image" value="2" name="Delete" src="http://images.google.com/intl/en_ALL/images/logos/images_logo_lg.gif" />
</form>

我的第一个想法是我应该在我的逻辑中添加两个字符

from: <cfif StructKeyExists(form,"Update")
to:   <cfif StructKeyExists(form,"Update.X")

但我想要一个处理type =“submit”和type =“image”的解决方案。现在我的逻辑是:

<cfif StructKeyExists(form,"Update") OR StructKeyExists(form,"Update.X")>
   <!--- UPDATE table --->
<cfelseif StructKeyExists(form,"Delete") OR StructKeyExists(form,"Delete.Y")>
   <!--- DELETE FROM Table --->
</cfif>
问:有没有更优雅的方法来检查按下了哪个按钮? 假设表格上有多个按钮,因为如果我只需检查表单是否已提交,我会查看是否存在form.fieldnames。

3 个答案:

答案 0 :(得分:11)

要获得原始的Form.Update和Form.Delete,同时在按钮上显示图像,请尝试以下操作:

<form action="somewhere" method="post">
    <button type="submit" name="Update"><img src="update.btn.png" alt="Update"/></button>
    <button type="submit" name="Delete"><img src="delete.btn.png" alt="Delete"/></button>
</form>


然后,您需要使用CSS来删除默认按钮样式,这样您才能获得图像,例如:

form button
{
    margin       : 0;
    padding      : 0;
    border-width : 0;
    background   : none;
    cursor       : pointer;
}


并确保在内容开始时使用有效的DOCTYPE以防止怪异模式 - 我通常会重置以确保它是第一件事:

<cfcontent reset/><!DOCTYPE html>

答案 1 :(得分:2)

另一种选择是将图像按钮命名为其他选项,只需添加一个名为Update的隐藏字段来检查它的值。我意识到在某些需要检查特定按钮被点击的特殊情况下可能无法正常工作,但这是一个快速修复,无需对图像提交做任何想象。

答案 2 :(得分:1)

您也可以只检查表单字段列表,看它是否包含字符串“Update”。类似的东西:

<cfif StructKeyExists(form,"fieldnames") and form.fieldnames contains "Update">
<!--- Do Update --->
<cfelseif StructKeyExists(form,"fieldnames") and form.fieldnames contains "Delete">
<!--- Do Delete --->
</cfif>

Form.fieldnames包含已提交的表单字段的所有名称。