Question

我在创建一个包含文字和图片的按钮时遇到问题。

<td> 

<button type="submit" name="report" value="Report"  
<?php 
 if($tab == 'Excel') 
   echo "id=\"tab_inactive\""; 
 else 
   echo "id=\"tab_active\"" ; ?>>
 <img src="images/report.gif" alt="Report"/>Report
</button>

<button type="submit" name="excel" value="Excel"  
<?php 
 if($tab == 'Excel' )
     echo "id=\"tab_active\""; 
 else 
     echo "id=\"tab_inactive\"" ; ?>>
<img src="images/Excel.gif" alt="Excel" width="16" height="16" /> Excel
</button>

</td>

这里$ tab是

$tab = strlen(trim($_POST[excel]))>0 ? $_POST[excel] : $_POST[report];

我试过这种方式，但这表现得如此奇怪。单击按钮： - 提交功能在Firefox中正常工作，但不在IE中。

而不是提交值（在此示例中值为'Report'和'Excel'），实际上它正在提交按钮的标签。

即如果我正在检查数组PRINT_R（$ _ POST）的值。它的价值是

Array ( [report] =>(Icon that i used) Report 
        [excel] => (Icon that i used) Excel 
        [frm_analysis] => [to_analysis] => )

这里我有一个以上的按钮，然后提交所有标签，尽管其中一个按下了。我不知道如何捕捉按下哪个按钮。

我甚至尝试过更改button type=button and onclick="document.formname.submit()"即使这样也会产生相同的效果。

你能帮我解决这个问题。

Answer 1

不幸的是，这是IE在处理<button>元素时的默认行为。据我所知，这个问题没有真正的解决办法，尽管有许多解决办法。

我的建议如下：

使用两个单选按钮创建名为report_type（或您选择的任何内容）的单选按钮控件：一个用于Excel，另一个用于报告。此外，还包括常规提交按钮。

使用Javascript（如果已启用），您可以隐藏单选按钮并提交按钮（display: none），并创建（通过JS）两个按钮，标记为Report和Excel。单击其中一个按钮，将选中正确的单选按钮，并提交表单。

这将允许您以当前形式创建表单，同时为没有javascript支持的用户提供工作后备。

而不是按钮的值，您现在可以查看Radio的值来决定您要使用哪种报告形式。

Answer 2

在IE中，

<button>被破坏了。我认为他们在IE7或8中更正了它。页面是否处于标准模式？这可能有助于IE7或8。

如果你需要支持破碎的版本，你可以尝试使用JS解决它，如果你不介意依赖它。例如：

<script type="text/javascript">
  function buttonclicked(button) {
    button.form.elements["buttonclicked"].value = this.value;
  }
</script>

<input type="hidden" name="buttonclicked" value="">
<button type="submit" name="report" onclick="buttonclicked(this)">
 <img src="images/report.gif" alt="Report"/>Report
</button>
<button type="submit" name="excel" onclick="buttonclicked(this)">
<img src="images/Excel.gif" alt="Excel" width="16" height="16" /> Excel
</button>

如果您需要区分点击的内容，我认为除了避免<button>和使用<input type=submit>之外，还有其他方法。

Answer 3

<button title="Search" onClick="javascript:executeFunction();">Search<br /><img src="images/search_icon.gif"/><br />More Text</button>

Answer 4

由于您的图片包含在<button> (<input>?)标记内，因此可能会将其包含在该值中。

为什么不将img用于onclick事件或带有GET请求的href？

Answer 5

没有测试过，只有一个想法：

<td> 

<button type="submit" name="active_page" value="Report"  
<?php 
 if( isset( $_POST['active_page'] ) && $_POST['active_page'] == 'Excel' ) 
   echo "id=\"tab_inactive\""; 
 else 
   echo "id=\"tab_active\"" ; ?>>
 <img src="images/report.gif" alt="Report"/>Report
</button>

<button type="submit" name="active_page" value="Excel"  
<?php 
 if( isset( $_POST['active_page'] ) && $_POST['active_page'] == 'Excel' )
     echo "id=\"tab_active\""; 
 else 
     echo "id=\"tab_inactive\"" ; ?>>
<img src="images/Excel.gif" alt="Excel" width="16" height="16" /> Excel
</button>

</td>

真的不明白你的问题，是这样的：

您想知道点击了哪个按钮，以显示标签或其他标签？正确？

HTML +按钮，上面有文字和图片

5 个答案: