Javascript 使用复选框或单选按钮在窗体操作之间切换

我有两个独立的insert.php文件。。。根据用户是否勾选了复选框或单选按钮，我将如何在它们之间切换

例如，如果我的html是这样设置的

<form action="x.php" method="post">

然后用户勾选复选框，因此表单需要更改为y.php

<form action="y.php" method="post">

---

这是如何实现的？

表单是一个标记，它具有属性。实际上，Action是form标记的一个属性

---

当用户选择复选框、radiobutton（javascript中的副捕获事件）时，您可以通过更改表单标记的属性来使用javascript执行此操作。

您可以在单选按钮上使用javascript函数

<script type="text/javascript">
function OnSubmitForm()
{
  if(document.myform.operation[0].checked == true)
  {
    document.myform.action ="x.php";
  }
  else
  if(document.myform.operation[1].checked == true)
  {
    document.myform.action ="y.php";
  }
  return true;
}
</script>
<form name="myform" onsubmit="return OnSubmitForm();">

   <input type="radio" name="operation" value="1" checked>radio1
   <input type="radio" name="operation" value="2">radio2
   <p>
   <input type="submit" name="submit" value="save">
   </p>
</form>

子表单（）上的函数
{
if（document.myform.operation[0]。选中==true）
{
document.myform.action=“x.php”；
}
其他的
if（document.myform.operation[1]。checked==true）
{
document.myform.action=“y.php”；
}
返回true；
}
无线电1
无线电2

这就是你要做的

<form id="myForm" action="x.php" method="post">
    <input type="checkbox" id="chkbox" />
</form>

<script type="text/javascript">
    $(document).ready(function(){
        $('#chkbox').click(function() {
            // `this` keyword is the native DOM object
            $('myForm').attr('action', this.checked? 'y.php' : 'x.php');
        });
    });
</script>

$（文档）.ready（函数（）{
$（'#chkbox'）。单击（函数（）{
//`this`关键字是本机DOM对象
$（'myForm'）.attr（'action'，this.checked？'y.php'：'x.php'）；
});
});

如果需要更改表单的操作并允许使用javascript，有一个非常简单的方法

为表单指定一个名称，以便使用javascript将其作为目标

选中一个ID为的复选框，然后使用if语句更改表单的属性“action”

下面是示例代码

<form name="form1" action="x.php" method="post">
    <input id="changeAction" type="checkbox" />
</form>
<script type="text/javascript">
    var checkBox = document.getElementById('changeAction');
    var form = document.form1;

    checkBox.onclick = function() {
        (checkBox.checked ? form.setAttribute('action', 'y.php') : form.setAttribute('action', 'x.php'))

        console.log(form);
    }
</script>

var checkBox=document.getElementById（'changeAction'）；
var form=document.form1；
checkBox.onclick=function（）{
（checkBox.checked？form.setAttribute（'action'，'y.php'）：form.setAttribute（'action'，'x.php'））
控制台日志（表格）；
}

一些内联javascript可以快速完成这一任务

jQuery示例：

<input type="radio" name="operation" value="1" checked onclick="$(this).parent().attr('action', 'x.php');">radio1
<input type="radio" name="operation" value="2" onclick="$(this).parent().attr('action', 'y.php');">radio2

radio1
无线电2

普通js

<input type="radio" name="operation" value="1" checked onclick="this.parentNode.action='x.php';">radio1
<input type="radio" name="operation" value="2" onclick="this.parentNode.action='y.php';">radio2

radio1
无线电2

使用jQuery和低调的JavaScript

<script type="text/javascript">
$(function(){
  $('#MyForm').submit(function(){
    var action = $(this).find('input[name=operation]:checked').val();
    $(this).attr('action', action);
  });
});
</script>

<form id="MyForm" method="post">

   <input type="radio" name="operation" value="x.php" checked>radio1
   <input type="radio" name="operation" value="y.php">radio2
   <p>
   <input type="submit" name="submit" value="save">
   </p>
</form>

$（函数（）{
$（'#MyForm'）。提交（函数（）{
var action=$（this）.find（'input[name=operation]：checked'）.val（）；
$（this.attr（'action'，action）；
});
});
无线电1
无线电2