javascript - 这个表单提交 JavaScript 究竟是如何工作的?

标签 javascript jquery

我对 JavaScript 很陌生,对于这个提交表单的脚本到底如何工作有以下疑问:

所以在我的 html 中我有以下形式:

<form id="actionButton<%=salDettaglio.getCodice()%>" action="salwf.do?serv=1" method="post">
    <button id="accept" name="ctrl" value="Accept" type="submit" class="acceptButton" onclick="sottometti(this,'<%=salDettaglio.getCodice()%>')">ACCEPT ICON BUTTON</button>
    <button id="cancel" name="ctrl" value="Cancel" type="submit" class="cancelButton" onclick="sottometti(this)">CANCEL ICON BUTTON</button>
    <button id="sap" name="ctrl" value="SAP" type="submit" class="sapButton" onclick="sottometti(this)">SAP ICON BUTTON</button>

    <input id="testId<%=salDettaglio.getCodice()%>" name="test" type="hidden">
</form>

因此,此表单的提交定向到页面salwf.do,并且每次传递一个名为serv的参数,并将1作为值(这是一个 GET 吗?)

然后在表单中,我有 3 个按钮,它们具有不同的 id 和不同的以及输入标记 (我认为这就是我提交的内容,对吗?)

正如您所看到的,当用户单击按钮时,称为 sottometti(this) 脚本,该脚本将对生成单击的对象的引用(在本例中为单击的按钮)作为参数)

这是 JavaScript 代码:

function sottometti(obj,id){
    document.getElementById('testId'+id).value = obj.value;
    document.getElementById('actionButton'+id).submit()
}

那么这个脚本到底是如何工作的呢?

我认为它做了以下事情(但我不确定,也许我错过了一些东西)。

它需要 2 个输入参数:单击的按钮引用 (obj) 和 id 字符串(代表 Java 对象的代码,但这现在并不重要)。

使用:

document.getElementById('testId'+id)

它检索表单的输入标记的引用,并使用按钮值(可以是:接受或<强>取消或Sap)

然后通过:

document.getElementById('actionButton'+id)

检索我的表单并提交

因此,单击的按钮的值将作为 POST 提交给 salwf.do servlet。

我的推理正确还是我遗漏了什么?

Tnx

最佳答案

是的,你的推理是正确的,但你有一些问题。

  1. 您只需从其中一个按钮传递 ID - 接受按钮
  2. 对于所有按钮,您似乎想要将 Accept/Cancel/SAP 添加到名为 testAccept、testCancel 或 testSAP 的隐藏字段,并提交 ID 为 actionButtonAccept、actionButtonCancel、actionButtonSAP 的表单,但在取消/SAP 情况。
  3. 不要在提交按钮的点击事件中提交

我愿意

function sottometti(obj){
  obj.form.test.value = obj.value;
  // obj.form.submit(); // all the buttons are submit buttons
}

关于javascript - 这个表单提交 JavaScript 究竟是如何工作的?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27250733/

相关文章:

javascript - JavaScript/jQuery 中各种函数作用域/事件绑定(bind)的优缺点

javascript - 使用 AngularJS 为每个页面添加导航和页脚

javascript - 类型错误 : Cannot read property 'googleplus' of undefined in IONIC with AngularJs

jquery - jQuery 的 die 的第二个参数是选择器字符串?

javascript - JQuery 从字符串内部获取文本

javascript - JQuery 高亮插件,参数不知何故未定义

javascript - 在 javascript &lt;script&gt; 标签中找到一个 jquery 对象

javascript - jQuery:如何比较每个索引中具有多个值的两个数组并删除重复项

javascript - 使用 JQuery 进行弹出窗口/对话框的最佳方式?

javascript - jQuery 在 DOM 中为不同的父级输入下一个输入