Question

我希望用户通过首先从下拉选择菜单中选择他们想要的顺序（数字 - 字母编号，字母 - 数字 - 字母等），然后按下一个，来随机生成字母和数字的组合。提交按钮来调用该功能。该函数随机从数组中拉出。然后，根据用户选择的选项，以这种方式组合它们并将其返回给用户。

在没有涉及条件或选择菜单之前，我已经使用了类似的代码。相反，它只是用户按下来调用该功能的按钮。该函数有两个或多个数组，使用Math.floor ( Math.random() * listOne.length );成功随机化。随机化后，该函数将部分与简单的listOne[partOne] + listTwo[partTwo]设置放在一起。

无论如何，这是我现在的基本代码。它只向用户返回undefined。我之前从未使用过条件或选择菜单，因此我不知道自己做错了什么。如果您能解释并向我提供解决方案，我将永远感激不尽。

<script type="text/javascript">

function myFunction()
{
var x=document.getElementById("result");
var listOne = Array();
var listTwo = Array();
var number = Math.floor ( Math.random() * listOne.length ); 
var letter = Math.floor ( Math.random() * listTwo.length );

listOne[0] = "1";
listOne[1] = "2";
listOne[2] = "3";

listTwo[0] = "A";
listTwo[1] = "B";
listTwo[2] = "C";

var select = document.getElementById("mySelect");
var order = select.options[select.selectedIndex].value;

x.innerHTML = Result

if (order === 1)
{var Result = listOne[number] + listTwo[letter] + listOne[number];}

if (order === 2)
{var Result = listTwo[letter] + listOne[number] + listTwo[letter];}

if (order === 3)
{var Result = listOne[number] + listTwo[letter] + listTwo[letter];}

if (order === 4)
{var Result = listTwo[letter] + listOne[number] + listOne[number];}

if (order === 5)
{var Result = listOne[number] + listOne[number] + listTwo[letter];}

if (order === 6)
{var Result = listTwo[letter] + listTwo[letter] + listOne[number];}

}
</script>



<div id="result"><i>Your result will appear here</i></div>

<select id=mySelect>
 <option value="1">one</option>
 <option value="2">two</option>
 <option value="3">three</option>
 <option value="4">four</option>
 <option value="5">five</option>
 <option value="6">six</option>
</select>

<input type="submit" onClick="myFunction();" value="Generate" />

Answer 1

由于undefined尚未定义，您获得Result。以下是您可能需要进行的更改。

由于您使用===进行评估，因此需要将order变量设置为int

var order = parseInt(select.options[select.selectedIndex].value);

接下来，将x.innerHTML = Result移到底部。

这是最终结果（稍微整理）：

function myFunction() {
    var x = document.getElementById("result");
    var listOne = Array();
    var listTwo = Array();
    var number = Math.floor(Math.random() * listOne.length);
    var letter = Math.floor(Math.random() * listTwo.length);
    var select = document.getElementById("mySelect");
    // casting it as an int. 
    // an alternative would be var order = +select.options[select.selectedIndex].value
    var order = parseInt(select.options[select.selectedIndex].value);

    var Result;

    listOne[0] = "1";
    listOne[1] = "2";
    listOne[2] = "3";

    listTwo[0] = "A";
    listTwo[1] = "B";
    listTwo[2] = "C";

    if (order === 1) {
        Result = listOne[number] + listTwo[letter] + listOne[number];

    }

    if (order === 2) {
        Result = listTwo[letter] + listOne[number] + listTwo[letter];
    }

    if (order === 3) {
        Result = listOne[number] + listTwo[letter] + listTwo[letter];
    }

    if (order === 4) {
        Result = listTwo[letter] + listOne[number] + listOne[number];
    }

    if (order === 5) {
        Result = listOne[number] + listOne[number] + listTwo[letter];
    }

    if (order === 6) {
        Result = listTwo[letter] + listTwo[letter] + listOne[number];
    }

    // add html AFTER Result has been set
    x.innerHTML = Result
}

Answer 2

<强> DEMO

将提交按钮设为ID #submit

<input id="submit" type="submit" value="Generate" />

这就是你所需要的：

function myFunction(){

    var $result = document.getElementById("result");
    var $select = document.getElementById("mySelect"); 
    var order = $select.options[$select.selectedIndex].value;
    var listOne = ["1","2","3"]; // now it has length
    var listTwo = ["A","B","C"];
    var randNum  = Math.floor ( Math.random() * listOne.length ); 
    var randChar = Math.floor ( Math.random() * listTwo.length );
    var res = "";
    if (order === "1"){
      res = listOne[randNum] + listTwo[randChar] + listOne[randNum];
    }
    if (order === "2"){
      res = listTwo[randChar] + listOne[randNum] + listTwo[randChar];
    }
    if (order === "3"){
      res = listOne[randNum] + listTwo[randChar] + listTwo[randChar];
    }
    if (order === "4"){
      res = listTwo[randChar] + listOne[randNum] + listOne[randNum];
    }
    if (order === "5"){
      res = listOne[randNum] + listOne[randNum] + listTwo[randChar];
    }
    if (order === "6"){
      res = listTwo[randChar] + listTwo[randChar] + listOne[randNum];
    }  
    $result.innerHTML = res;
}

document.getElementById("submit").onclick = myFunction;

Answer 3

试试这个：

工作演示：JSFiddle

HTML：

<div id="result"><i>Your result will appear here</i></div>
<form name="myform">
<select id="mySelect">
 <option value="1">one</option>
 <option value="2">two</option>
 <option value="3">three</option>
 <option value="4">four</option>
 <option value="5">five</option>
 <option value="6">six</option>
</select>

<input id="calc" type="button" value="Generate" />
</form>

function myFunction() {
    var x=document.getElementById("result");
    var listOne = [1, 2, 3];
    var listTwo = ["A", "B", "C"];

    var select = document.getElementById("mySelect");
    var order = +(select.options[select.selectedIndex].value);

    var number = Math.floor ( Math.random() * listOne.length ); 
    var letter = Math.floor ( Math.random() * listTwo.length );
    var result;

    if (order == 1) {
        result = listOne[number] + listTwo[letter] + listOne[number];
    }

    if (order === 2) {
        result = listTwo[letter] + listOne[number] + listTwo[letter];
    }

    if (order === 3) {
        result = listOne[number] + listTwo[letter] + listTwo[letter];
    }

    if (order === 4) {
        result = listTwo[letter] + listOne[number] + listOne[number];
    }

    if (order === 5) {
        result = listOne[number] + listOne[number] + listTwo[letter];
    }

    if (order === 6) {
        result = listTwo[letter] + listTwo[letter] + listOne[number];
    }

    x.innerHTML = result;

}

//Call the function;
document.getElementById("calc").onclick = myFunction;

Answer 4

您可以将选项元素的值设为'nln'之类的字符串，以表示序列号码编号＆＃39;。

该功能可以是：

function getRandomString(s) {
  var a;
  var t = '';
  var data = {n: [0,1,2,3], l: ['a','b','c','d']};
  s = s.split('');

  for (var i=0, iLen=s.length; i<iLen; i++) {
    a = data[s[i]];
    t += a[Math.random()*a.length | 0];
  }
  return t;
}

以上可能会重复＆＃34;随机＆＃34;串。要获取唯一值，请使用 splice 从数组中获取值而不是普通属性访问：

    t += a.splice(Math.random()*a.length | 0, 1);

HTML可以像：

<form onsubmit="document.getElementById('result').innerHTML=getRandomString(this.mySelect.value);return false;">
  <select id=mySelect>
    <option value="nln" selected>one</option>
    <option value="lnl">two</option>
    <option value="nll">three</option>
    <option value="lnn">four</option>
    <option value="nnl">five</option>
    <option value="lln">six</option>
  </select>
  <input type="submit"value="Generate">
</form>
<div><span id="result"></span></div>

如何使用提交按钮调用基于所选选项的条件函数？

4 个答案: