Question

我想创建一个这样的表单：

在表单的输入中输入您的ID号并提交。
表单的操作变为/account/{id}/。

我被告知JavaScript是实现这一目标的唯一方法（参见here），但是如何？

Answer 1

使用jQuery可能看起来像这样：

$('#inputAccount').change(function () {
    $('#myForm').attr('action', 'http://www.example.com/account/' + $('#inputAccount').val());
});

这应该在输入元素中的文本发生更改时更改表单的操作。您也可以使用.blur()而不是.change()来执行焦点离开输入元素时的操作，因此它不会一直保持更改等等。然后，当提交表单时，它应该提交到最后放置在其action属性中的内容。

Answer 2

<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
        $(frm.txt).keyup(function(){
            $(frm).get(0).setAttribute('action', '/account/'+$(frm.txt).val());
        });
    });
    </script>
</head>
<body>
<form id="frm" action="foo">
    <input type="text" id="txt" />
    <input type="submit" id="sub" value="do eet" />
</form>

Answer 3

你可以在JavaScript中做这样的事情。根据选中的单选按钮（在这种情况下，但它可能是另一个表单元素），它将被选择为一个动作或另一个：

<script type="text/javascript">
function OnSubmitForm()
{
  if(document.myform.operation[0].checked == true)
  {
    document.myform.action ="insert.html";
  }
  else
  if(document.myform.operation[1].checked == true)
  {
    document.myform.action ="update.html";
  }
  return true;
}
</script>

<form name="myform" onsubmit="return OnSubmitForm();">
   name: <input type="text" name="name"><br>
   email: <input type="text" name="email"><br>
   <input type="radio" name="operation" value="1" checked>insert
   <input type="radio" name="operation" value="2">update
   <p>
   <input type="submit" name="submit" value="save">
   </p>
</form>

带有动态操作的HTML表单（使用JavaScript？）

3 个答案: