【问题标题】:Change value of input and submit form in JavaScript在 JavaScript 中更改输入和提交表单的值
【发布时间】:2011-10-18 05:43:33
【问题描述】:

我目前正在制作一个基本表格。当您点击提交按钮时,它应该首先更改字段的值,然后像往常一样提交表单。看起来有点像这样:

<form name="myform" id="myform" action="action.php">
    <input type="hidden" name="myinput" value="0" />
    <input type="text" name="message" value="" />
    <input type="submit" name="submit" onclick="DoSubmit()" />
</form>

这就是我对 JavaScript 代码的了解。它将“myinput”的值更改为 1,但不提交表单。

function DoSubmit(){
  document.myform.myinput.value = '1';
  document.getElementById("myform").submit();
}

【问题讨论】:

  • 为什么不在 html 中将 myinput 值改为 1?
  • 我当然可以,但如果这是我想要的,我就不会问了
  • @Paparappa 这个反应杀了它!

标签: javascript html forms onclick submit


【解决方案1】:

你可以这样做:

<form name="myform" action="action.php" onsubmit="DoSubmit();">
    <input type="hidden" name="myinput" value="0" />
    <input type="text" name="message" value="" />
    <input type="submit" name="submit" />
</form>

然后修改你的DoSubmit函数只返回true,表示“没关系,现在可以提交表单了”给浏览器:

function DoSubmit(){
  document.myform.myinput.value = '1';
  return true;
}

我也会警惕在提交按钮上使用 onclick 事件;事件的顺序不是很明显,如果用户通过例如在文本框中点击返回来提交,您的回调将不会被调用。

【讨论】:

  • 不,您可以像这样使用name 属性访问表单及其子元素。
  • +1 指出当通过按下按钮本身以外的其他方式提交时不会触发 onclick 事件。
【解决方案2】:
document.getElementById("myform").submit();

这不起作用,因为您的表单标签没有 id。

像这样改变它,它应该可以工作:

<form name="myform" id="myform" action="action.php">

【讨论】:

  • 哦,它有一个 ID,对不起,我的编码有点快。编辑了之前的帖子。
【解决方案3】:

这是简单的代码。您必须为您的输入设置一个 id。这里称它为“myInput”:

var myform = document.getElementById('myform');
myform.onsubmit = function(){
    document.getElementById('myInput').value = '1';
    myform.submit();
};

【讨论】:

    【解决方案4】:

    没有。当您的输入类型是提交时,您应该在标记中声明一个onsubmit 事件,然后进行您想要的更改。意思是,在你的表单标签中定义一个onsubmit

    否则将输入类型更改为按钮,然后为该按钮定义onclick 事件。

    【讨论】:

      【解决方案5】:

      您正在尝试访问基于name 属性的元素,该属性适用于回发到服务器,但JavaScript 响应id 属性。添加一个与name 具有相同值的id,一切都应该正常工作。

      <form name="myform" id="myform" action="action.php">
        <input type="hidden" name="myinput" id="myinput" value="0" />
        <input type="text" name="message" id="message" value="" />
        <input type="submit" name="submit" id="submit" onclick="DoSubmit()" />
      </form>
      
      function DoSubmit(){
        document.getElementById("myinput").value = '1';
        return true;
      }
      

      【讨论】:

        【解决方案6】:

        我的问题原来是我分配为document.getElementById("myinput").Value = '1';

        注意到 Value 中的大写 V 了吗?一旦我将其更改为小写,即 value,数据就会开始发布。奇怪的是它也没有给出任何 JavaScript 错误。

        【讨论】:

        • 为什么会报错?您正在创建一个新属性“Value”,这非常好。
        • 我想说的是我将“价值”称为“价值”。它当然会给出一个未定义的错误,因为这个属性“Value”没有被初始化
        • 好吧,它会:1)如果你正在设置它,不会出错,2)如果你正在使用它,那么默默地返回undefined,这不是错误。
        • 你是对的..我应该再澄清一点..我正在分配一个“价值”属性并发布一个表格。服务器中收到的 POST 正在寻找“值”,因此从未找到我设置的值
        【解决方案7】:

        您可以使用 onchange 事件:

        <form name="myform" id="myform" action="action.php">
            <input type="hidden" name="myinput" value="0" onchange="this.form.submit()"/>
            <input type="text" name="message" value="" />
            <input type="submit" name="submit" onclick="DoSubmit()" />
        </form>
        

        【讨论】:

          【解决方案8】:

          这可能会对你有所帮助。

          您的 HTML

          <form id="myform" action="action.php">
          <input type="hidden" name="myinput" value="0" />
          <input type="text" name="message" value="" />
          <input type="submit" name="submit" onclick="save()" />
          </form>
          

          你的脚本

              <script>
                  function save(){
                      $('#myinput').val('1');
                      $('#form').submit();
                  }
              </script>
          

          【讨论】:

            猜你喜欢
            • 2021-04-30
            • 2015-08-02
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 2023-03-26
            • 2014-02-23
            • 2018-04-28
            • 1970-01-01
            相关资源
            最近更新 更多