zoukankan      html  css  js  c++  java
  • 如何为Form表单的多个提交按钮指定不同的Action地址?

    这是我很久以前看到的一个技巧,但我忘记在哪里了,当时遇到这样的需求,做了笔记,现在整理成文章分享出来,因为我感觉这个小技巧还是挺有用的,这种应用场景也算比较常见,比如一个表单有“保存”、“保存草稿”、“预览”多个Submit按钮,就可以用到这个技巧。

    假如我们有这样一个表单:

    <form action="/submit">
    
      <!-- 其它 input 等标签 -->
    
      <input type="submit" value="Submit">
    
    </form>
    

    这里提交表单时,它会转到URL:/submit,假设您需要另一个提交按钮,该按钮提交到一个不同的URL。

    当时我在网上搜索了一些方法,一种方法是放弃提交不同的URL,但给每个提交按钮一个共享的名称,但值不同,然后在处理时检查该值,以执行不同的操作。具体如下:

    <input type="submit" name="action" value="Value-1">
    <input type="submit" name="action" value="Value-2">
    

    如果需要,可以在处理和重定向期间读取该值,这确实是解决问题的一种方法。

    另一种方法是使用JavaScript在单击按钮时更改form标签的acton属性,写法有很多种,但归结起来就是:

    <form name="form">
    
      <!-- 其它 input 等标签 -->
    
      <input type="submit" onclick="javascript: form.action='/submit';">
      <input type="submit" onclick="javascript: form.action='/submit-2';">
    
    </form>
    

    这依赖于JavaScript来工作,这并没有什么大问题,毕竟现在有谁浏览网页会把JavaScript关掉呢。

    最好的方法,其实是用HTML已经有的一个属性:formaction,应该很少人知道这个属性,至少当时我是不知道的。

    你可以把formaction属性直接将用在submit按钮上,它将覆盖表单本身上的action操作。例如:

    <form action="/submit">
    
      <input type="submit" value="Submit">
    
      <input type="submit" value="Go Elsewhere" formaction="/elsewhere">
    
    </form>
    

    是不是很简单,希望对你有所帮助。

  • 相关阅读:
    Matlab中使用Java api画图图形并保存为jpeg格式
    基于注解的Mybatis mapper 接口注意事项
    Chap 2 Representing and Manipulating Information (CS:APP)
    设计模式之享元模式
    辛星浅析Linux中的postfix
    ZOJ 1364 Machine Schedule(二分图最大匹配)
    Scrapy系列教程(3)------Spider(爬虫核心,定义链接关系和网页信息抽取)
    恩布企业 IM iOS端 1.1 公布, 开源手机 IM
    leetcode_Power of Two_easy
    小强的HTML5移动开发之路(45)——汇率计算器【1】
  • 原文地址:https://www.cnblogs.com/fehoney/p/12941490.html
Copyright © 2011-2022 走看看