php 表单中的提交按钮也可以作为锚点吗？答案

【问题标题】：Can a submit button in a php form also be an anchor?php 表单中的提交按钮也可以作为锚点吗？
【发布时间】：2011-09-17 19:27:39
【问题描述】：

为了在添加到购物车之前自定义产品，我使用带有两个提交点的 php 表单 - 上传图像并附加文本。我不想在每次单击按钮后将页面刷新到顶部，而是想将锚点设置为更接近下一步并将按钮用作<a href="#"></a>。

这是上传按钮代码：

    <div id="virtueupl_form" style='width:100%'>
    <form id="adminForm" name="adminForm"  action="<?php echo JRoute::_('index.php?option=com_virtueupload&view=form'); ?>" method="post" enctype="multipart/form-data" onSubmit="return checkForm();">
    <table width="130px" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="70px" colspan="2" valign="top">
    <label for="file"><?php echo VUOutput::_('YLANG_FORM_LBL_FILE'); ?></label>     <br/>
    <input name="file" type="file" />
    <input id="upload_button" class="button" type="submit" value="<?php echo VUOutput::_('YLANG_UPLOAD'); ?>" onclick="this.form.status.value = '<?php echo VUOutput::_('YLANG_STAT_INITUPL'); ?> '; $('spinner').style.display = 'block';  this.form.status.style.color = '#339900'; " />   
</td>
</tr>

单击按钮后，锚标记属于何处，将其发送到同一表单下方的位置？同样，在“附加文本”之后，我想避免要求用户从页面顶部向下滚动到表单的下一部分。我尝试了各种安排，但在不知道自己在做什么的情况下，我并没有成功。

当我搜索这个论坛（和其他论坛）时，我只能找到简单的 html 锚结构或关于使用提交按钮与文本链接的讨论。我想我理解锚是如何工作的，我只是不知道如何在一个表单中配置它，其他事件由同一个按钮触发。从我读到的内容来看，“onclick”命令似乎也很重要，但对于我有限的经验，我找不到任何明显的东西。也许我没有搜索正确的术语？

谢谢。

【问题讨论】：

标签： php onclick anchor

【解决方案1】：

提交按钮是特殊按钮，会自动触发表单的submit 事件。使用任何其他方式，您必须从 Javascript 手动触发事件。

例如，使用锚点，你会得到类似的东西

<form id="frm" name="frm" action="" method="get">
  <input type="hidden" name="someinput1" value="hello" />
  <input type="hidden" name="someinput2" value="world" />
  <a href="#" onclick="document.forms['frm'].submit();">Submit</a>
</form>

通常，与任何其他方法相比，使用提交按钮更可取，因为它不依赖于 Javascript，并且默认本地化为浏览器的区域设置。您实际上可以有一个提交按钮并简单地使用 CSS 设置它的样式。在同一个表单中拥有多个提交按钮也很好。

另外，请注意某些示例会触发事件from the href attribute，但我不推荐使用此 IMO，因为它会将 Javascript 暴露给用户的锚提示（当鼠标悬停为链接时，您可以看到它的内容 @页面底部的 987654325@ 属性）。

最后，您几乎可以使用任何元素来触发表单提交事件！以这个为例（使用 jQuery）：

<form id="frm" name="frm" action="" method="get">
  <input type="hidden" name="someinput1" value="hello" />
  <input type="hidden" name="someinput2" value="world" />
  <div id="elemSubmit" style="text-align:center; border:1px solid black;">Submit</div>
</form>
<script type="text/javascript">
   $(function() {
      $('elemSubmit').click(function() { $('#frm').submit(); });
   });
</script>

【讨论】：