使用纯JS

Question

我有一个fontVortMetodo表单，我声明为

var fM = document.forms["fontVortMetodo"];

用户可以选择将表单提交到三个PHP页面之一。我让他首先通过名为select的单选按钮做出选择。然后他应该按下一个按钮，它将表单元素的结果激发到所选页面。

对于这次射击，我使用了函数

function destinu() {
  if (fM.elements("select")[0].checked) {
    fM.action = "private_php/Zamenhofa.php";
  } else if (fM.elements("select")[1].checked) {
    fM.action = "private_php/intereuropeco.php";
  } else if (fM.elements("select")[2].checked) {
    tutm = true;
    fM.action = "private_php/tutmondeco.php";
  }
}

出现此错误：

TypeError：fM.elements("select")[0].checked不是函数＆＃34;。

也许我应该尝试

var destiny = getElementsByName("select")

然后继续if (destiny[0].checked)或if (destiny[0].checked == true)。

我不知道有人建议我使用jQuery，还有JavaScript我没有参考文本。我在哪里可以找到一个很好的jQuery教程，虽然我更喜欢使用JavaScript pure做什么？

Answer 1

使用纯JS

使用dataset属性存储操作。
使用此选择器[name="select"]:checked获取已选中的单选按钮。

＆＃13;

document.querySelector('button').addEventListener('click', function(e)  {
  e.preventDefault();  
  var checked = document.querySelector('[name="select"]:checked');
  
  var action = checked.dataset.action;  
  var form = document.querySelector('#fontVortMetodo');
  
  form.setAttribute('action', action);
  
  var tutm = checked.dataset.tutm !== undefined;
  
  console.log("Action: " + action);
  console.log('Is tutm: '+ tutm);
  
  //$form.submit();  // This is if you need to to submit the form.
});

＆＃13;

<form id='fontVortMetodo' name='fontVortMetodo'>
  <input type='radio' name='select' data-action="private_php/Zamenhofa.php">
  <input type='radio' name='select' data-action="private_php/intereuropeco.php">
  <input type='radio' name='select' data-action="private_php/tutmondeco.php" data-tutm='true'>
  <button>Submit</button>
</form>

＆＃13;

如何使用getElementsByName识别选中的单选按钮？

1 个答案:

使用纯JS