【问题标题】:Cannot submit form from Javascript on Firefox无法在 Firefox 上从 Javascript 提交表单
【发布时间】:2015-09-24 17:50:20
【问题描述】:

我正在创建一个表单以在 javascript 函数中提交。我将该函数绑定到一个选择元素的 onchange 事件。事件在 chrome 和 firefox 中运行良好,我对其进行了测试,它调用了该函数。但问题是; chrome 提交表单时,firefox 没有。能否请你帮忙? 谢谢。

Javascript 函数:

function getStatementDetails()
{
    var stmtSelect = document.getElementById("statementSelect");
    var selectedId = stmtSelect.options[stmtSelect.selectedIndex].value;

    var stmtForm = document.createElement("form");
    stmtForm.setAttribute('method', "post");
    stmtForm.setAttribute('action', "mymiles-mystatement");

    var stmtId = document.createElement("input");
    stmtId.setAttribute('type', "hidden");
    stmtId.setAttribute('name', "statementID");
    stmtId.setAttribute('id', "statementID");
    stmtId.setAttribute('value', selectedId);

    stmtForm.appendChild(stmtId);
    stmtForm.submit();
};

选择输入:

<select id="statementSelect" name="statementSelect" class="select-miles select-miles-medium spacing-right-10" onchange="getStatementDetails()">

编辑: 我已阅读建议的帖子并尝试过。还是行不通。 函数最新状态:

function getStatementDetails()
{
    var stmtSelect = document.getElementById("statementSelect");
    var selectedId = stmtSelect.options[stmtSelect.selectedIndex].value;

    var stmtForm = document.createElement("form");
    stmtForm.setAttribute('method', "post");
    stmtForm.setAttribute('action', "mymiles-mystatement");

    var stmtId = document.createElement("input");
    stmtId.setAttribute('type', "hidden");
    stmtId.setAttribute('name', "statementID");
    stmtId.setAttribute('id', "statementID");
    stmtId.setAttribute('value', selectedId);

    var stmtSbmt = document.createElement("input");
    stmtSbmt.setAttribute('type', "submit");
    stmtSbmt.setAttribute('name', "tryMe");
    stmtSbmt.setAttribute('id', "tryMe");
    stmtSbmt.setAttribute('value', "try submit");

    stmtForm.appendChild(stmtId);
    stmtForm.appendChild(stmtSbmt);
    stmtForm.submit();
};

【问题讨论】:

  • 这似乎是一个正确的代码,很长,这是必要的,但它必须工作。您可以告诉我们控制台是否抛出错误?在 Firefox 中,ALT + F2 打开超级开发者栏,并在工具按钮中,您可以在其中找到检查器、控制台等。
  • 也许 Firefox 不会在同一个 JavaScript 方法中刷新 DOM 更改。您可以尝试使用 Timeout 等待或使用 jQuery
  • 使用 jQuery 是 2 行代码。但他是用纯 JavaScript 写的,我不知道为什么,但我认为他有他的理由
  • @MarcosPérezGude - 它可以为您解决这些问题。如果 jQuery 是答案,那么你问错了问题
  • @MarcosPérezGude - 但是 Alt+F2 什么也没做 - 现在做你真尴尬

标签: javascript html forms firefox form-submit


【解决方案1】:

如果您想提交表单,您需要一个提交按钮,否则您需要使用form data api

<input type="submit" value="click me baby" />

您可以更轻松地在 html 中编写表单,而不是使用 javascript 动态创建它(除非有您没有考虑到的原因)

你的 html 中有 select 元素,为什么不是整个表单?

还值得一提的是,您应该将您的提交按钮命名为 submit,因为如果您在任何时候需要 preventDefault(),这可能会导致问题。

【讨论】:

    【解决方案2】:

    cmets 部分已满,用户可能看不到正确答案。 @spuyet 说这就是这里的解决方案:

    Javascript form.submit() not working in Firefox

    似乎 Firefox 不会发送没有任何按钮的表单。如果您在代码中包含提交按钮,则必须有效。

      var button = document.createElement("input");
      button.setAttribute('type', "submit");
      stmtForm.appendChild(button);
    

    我认为这可以解决您的问题。

    如果你解决了,请告诉我们。

    【讨论】:

    • 我完全复制了您的建议,但仍然不起作用。在 Chrome 中它运行良好。我想我需要在这里为我的问题找到另一种解决方案或方法。感谢您的关注。
    • 我认为您需要将表单附加到正文中,如果您愿意,可以将其隐藏,然后提交。 document.getElementsByTagName("body")[0].appendChild(stmtForm);
    • 这行得通。我将表单添加到正文中,现在提交正在工作。非常感谢,没有您的帮助无法解决这个问题。
    • 很高兴为您提供帮助。感谢@spuyet 告诉提交按钮
    猜你喜欢
    • 1970-01-01
    • 2012-07-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-12-11
    相关资源
    最近更新 更多