javascript - 如何通过单击按钮调用具有不同选择选项的不同功能

Question

我正在尝试使用一个选择选项并调用按钮单击的不同功能 例如:

<select id="S3_Bucket_Actions" onchange="selectfunction()">
<option disabled="disabled" class="others" selected="selected">select one option</option>
<option value="listBucket">listBucket</option>
<option value="createBucket">createBucket</option>
<option value="doFileUpload">doFileUpload</option>
</select>
<input type='button' class='btn btn-default' value='Run tests' id='#s3-listBucket' />
<div id="buttonholder"></div>
<script>
function selectfunction() {
var selectoption = document.getElementById("S3_Bucket_Actions").value;
document.getElementById("buttonholder").innerHTML = "<input type='button' class='btn btn-default' value='Run All tests' id='s3-"+selectoption+"' />";
             }
 </script>

我希望每个按钮单击与不同选择选项相关的不同函数应该被调用。 有人可以帮忙吗？

Answer 1

如果我正确理解你的问题，你想根据下拉列表中的字符串调用一个函数。这是一个为 doFileUpload 选项工作的例子

<select id="S3_Bucket_Actions" onchange="selectfunction(event)">
<option disabled="disabled" class="others" selected="selected">select one option</option>
<option value="listBucket">listBucket</option>
<option value="createBucket">createBucket</option>
<option value="doFileUpload">doFileUpload</option>
</select>
<input type='button' class='btn btn-default' onclick="callFunctionByString()" value='Run tests' id='#s3-listBucket' />
<div id="buttonholder"></div>
<script>
var selectoption = ""
function selectfunction(event) {

selectoption = event.srcElement.selectedOptions[0].innerHTML

alert(selectoption)
document.getElementById("buttonholder").innerHTML = "<input type='button' class='btn btn-default' value='Run All tests' id='s3-"+selectoption+"' />";
             }
             
             function callFunctionByString(){
 window[selectoption](arguments)
             }
             function doFileUpload(){
             alert("I upload a File")
             }
 </script>

但是请考虑，这既不是最佳解决方案，也不是没有错误，而只是一个简单的演示。

参见 this question供引用