Javascript: select 选项值 --> 按钮名称

Question

我需要将所选值添加到我的表单提交按钮。

原因是因为当值为 "yes" 时有一个 post 调用 if (isset($_POST['yes']) 并且对于 "no" 有另一个 if (isset($_POST['no']))

所以我只需要：

<select>
<option value"yes">Yes</option>
<option value="no">No</option>
</select>

并且必须在此处更新此值：

<input type="submit" value="Send form" name="Value from the select option">

Answer 1

只需将 name 属性添加到 select 元素

<select name="userSelected">
  <option value"yes">Yes</option>
  <option value="no">No</option>
</select>

现在在 php 中使用：

<?php
  if(isset($_POST['userSelected'])){
    if($_POST['userSelected'] == 'yes'){
      /* code for yes */
    }else{
      /* code for no */
    }
}

Answer 2

使用 select 中的 onChange 事件获取和更改按钮名称

function updateBtn(sel) {
    
  document.getElementById('sendForm').setAttribute('name', sel.value);
  
  }

<select onChange="updateBtn(this)">
<option value"yes">Yes</option>
<option value="no">No</option>
</select>

<input type="submit" id="sendForm"  value="Send form" name="Value from the select option">

Answer 3

这是一种方法

document.querySelector('form').addEventListener("submit", function(e){

   e.target.querySelector('input[type=submit]').name = e.target.querySelector('select').value;

});

<form action="">
  
  <select>
    <option value="yes">Yes</option>
    <option value="no">No</option>
  </select>

  <input type="submit" value="Submit" name="">

</form>

如果你真的想在 select 上使用它，请这样做而不是内联脚本

注意：确保您已将输入的名称设置为 select 的默认名称，否则如果没有人更改它，它就没有值

document.querySelector('select').addEventListener("change", function(e){

   e.target.form.querySelector('input[type=submit]').name = e.target.value;

});

<form action="">
  
  <select>
    <option value="yes">Yes</option>
    <option value="no">No</option>
  </select>

  <input type="submit" value="Submit" name="yes">

</form>

Javascript: select 选项值 --> 按钮名称

Javascript: select option value --> button name

javascript