Fatal编程技术网
  • javascript/
  • 单击按钮以获取Javascript文本框中显示的随机项

单击按钮以获取Javascript文本框中显示的随机项

javascript html

单击按钮以获取Javascript文本框中显示的随机项,javascript,html,Javascript,Html,所以，我的Mab Libs程序运行良好。当我想创建一个按钮让用户显示来自数组的建议时，问题就出现了。我使用此函数： function GetValue(myNameArray) { let myNameArray= new Array["item1","item2","item3"]; var randomName = myNameArray[Math.floor(Math.random() * myNameArray.length)]; document.getElem

所以，我的Mab Libs程序运行良好。当我想创建一个按钮让用户显示来自数组的建议时，问题就出现了。我使用此函数：

  function GetValue(myNameArray)
{
    let myNameArray= new Array["item1","item2","item3"];
    var randomName = myNameArray[Math.floor(Math.random() * myNameArray.length)];
  document.getElementById("personOne") = randomName;
}
然后，当我进入它并测试代码时，它不会在文本框中显示结果。互联网上没有类似的情况，唯一的结果是针对一般阵列

谢谢你的帮助

我正在使用的完整代码：

<html><head>
<title>
  Mad Libs Story
</title>
<style>
  h3 {
    text-align: center;
  }

  #input {
    text-align: center;
    box-sizing: border-box;
    width: 100%;
    border: solid #5B6DCD 10px;
    padding: 3px;
  }

  #madLibCreation {
    text-align: center;
    box-sizing: content-box;
    width: 100%;
    border: solid #FFFFFF;
    padding: 3px;
    font-weight: bold;
    font-size: 24px;
  }


</style>
<script>

function getVars() {

    var firstPerson = String(document.getElementById("personOne").value);
    var firstAdjective = String(document.getElementById("adjectiveOne").value);
    var secondAdjective = String(document.getElementById("adjectiveTwo").value);
    var thirdAdjective = String(document.getElementById("adjectiveThree").value);
    var secondPerson = String(document.getElementById("personTwo").value);
    var fourthAdjective = String(document.getElementById("adjectiveFour").value);
    var firstNumber = Number(document.getElementById("numberOne").value);
    var thirdPerson = String(document.getElementById("personThree").value);

document.getElementById("madLibCreation").innerHTML = "Dear " + firstPerson + ", Overall, Camp Ad-Lib is " + firstAdjective + ". The camp counselors are " + secondAdjective + " and the food is " + thirdAdjective + ". Today, I met someone named " + secondPerson + "and we became " + fourthAdjective + " friends. I hope to write to you in " + firstNumber + " days. Sincerely, " + thirdPerson + ".";
} 

  function GetValue(myNameArray)
{
    let myNameArray= new Array["item1","item2","item3"];
    var randomName = myNameArray[Math.floor(Math.random() * myNameArray.length)];
  document.getElementById("personOne") = randomName;
}
</script>
</head>
<body>
<h3>
Welcome to "A Letter From Camp"! Have fun!   
</h3>  

  <div id="input">

    <p>
  Name of Person in Room: <input type="text" id="personOne"> <input type="button" value="random" onclick="getValue();">
</p>

<p>
  Adjective: <input type="text" id="adjectiveOne">
  </p>

 <p>
   Adjective: <input type="text" id="adjectiveTwo">
  </p>

  <p>
    Adjective: <input type="text" id="adjectiveThree">
  </p>

  <p>
    Name of Someone: <input type="text" id="personTwo">
  </p>  

  <p>
    Adjective: <input type="text" id="adjectiveFour">
  </p>

  <p>
    Number: <input type="text" id="numberOne">
  </p>

  <p>
   Name of Someone: <input type="text" id="personThree">
  </p>
<p>

<input type="submit" value="Get My MadLib Creation!" onclick="getVars();">
  </p>
  </div>
<p id="madLibCreation"></p>


</body></html>


疯狂的Libs故事
h3{
文本对齐：居中；
}
#输入{
文本对齐：居中；
框大小：边框框；
宽度：100%；
边框：实心#5B6DCD 10px；
填充：3倍；
}
#马德利布创作{
文本对齐：居中；
框大小：内容框；
宽度：100%；
边框：实心#FFFFFF；
填充：3倍；
字体大小：粗体；
字体大小：24px；
}
函数getVars（）{
var firstPerson=String（document.getElementById（“personOne”）.value）；
var firstdescriptor=String（document.getElementById（“形容词一”）.value）；
var secondapprox=String（document.getElementById（“形容词二”）.value）；
var thirdAdjective=String（document.getElementById（“形容词三”）.value）；
var secondPerson=String（document.getElementById（“personTwo”）.value）；
var fourthAdjective=String（document.getElementById（“形容词四”）.value）；
var firstNumber=Number（document.getElementById（“numberOne”）.value）；
var thirdPerson=String（document.getElementById（“persontree”）.value）；
document.getElementById（“madLibCreation”）.innerHTML=“亲爱的”+第一人称+”，总的来说，临时营地是“+第一形容词+”。营地顾问是“+第二形容词+”，食物是“+第三个目标+”。今天，我遇到了一个名为“+第二人称+”的人，我们成了“+第四个目标+”的朋友。我希望在年给你写信+firstNumber+“天。真诚地，+thirdPerson+”；
} 
函数GetValue（myNameArray）
{
让myNameArray=新数组[“item1”、“item2”、“item3]；
var randomName=myNameArray[Math.floor（Math.random（）*myNameArray.length）]；
document.getElementById（“personOne”）=随机名称；
}
欢迎来到“营地来信”！玩得高兴

房间内人员姓名：



形容词：



形容词：



形容词：



某人的姓名：



形容词：



编号：



某人的姓名：
代码中有一些语法错误。函数名中的get应该是小写的，并删除参数

        function getValue()
        {
            var myNameArray = ["item1", "item2", "item3"];
            var randomName = myNameArray[Math.floor( Math.random() * myNameArray.length )];
            document.getElementById( "personOne" ).value = randomName;
        }
如果将此项放在html文档的head标记中：

<script src="https://randojs.com/1.0.0.js"></script>
这实现了使随机性更短、更具可读性

document.getElementById("personOne").value = rando(["item1", "item2", "item3"]).value;