Question

所以我尝试重写它，看起来并没有太大的不同，但为了工作，这就是我必须提出来的。
我在下面包含了html，css和javascript文件。也许你可以在你身边运行并提供反馈。它仍然没有在我的运行。也许那就是它，只是没有在我的结束。

PS：我使用（i + = 1）代替（i ++），因为我可以更好地阅读它。

JavaScript：jsmain.js

var gate = 0;
var count = [];
var daLink = []
var howMany = document.getElementById("howmany").value;

function addAnInput(){
    document.getElementById("newholder").innerHTML += "Inser Link: <input class='boxes' id='gate" + gate.toString() + "' type='text' size='83' /><br />";
    count.push(gate);
    gate += 1;
}

function getValues(){
    daLink = [];
    for (i = 0; i < count.length; i += 1){
        daLink.push(document.getElementById("gate" + i));
    };
    for (i = 0; i < howmany; i += 1){
        function thisNow(){return Math.floor(Math.random() * daLink.length)};
        var thisOne = thisNow;
        window.open(daLink[thisOne], "_blank");
    }
}

HTML：index.html

<html>
<head>
<title>DMA Link opener</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="jsmain.js"></script>
<link rel="stylesheet" type="text/css" href="cssmain.css" />
</head>
<body>

    <div class="title">
        <h1>DMA Link opener</h1>
    </div>

    <div class="separator"></div>

    <div class="content">
        <div class="button-holder">
            <p id="add-button" onClick="addAnInput()">Add Link</p>
            <p id="runit" onClick="getValues()">Run It</p>
            <input id="howmany" type="number" min="1" max="5" />
        </div>
        <form id="newholder"></form>
    </div>

    <div class="separator"></div>

</body>
</html>

CSS：cssmain.css

h1{
    width: 50%;
    color: white;
    font-family: Tahoma;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    border: 4px solid gray;
    border-radius: 0 20px 0 20px;
    background: linear-gradient(to bottom right, lightgray, lightblue);
    text-shadow: 0 0 3px black;
}

.separator{
    width: 70%;
    border-bottom: 1px solid lightgray;
    margin-left: auto;
    margin-right: auto;
}

.button-holder{
    color: white;
    font-size: 18px;
    width: 20%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    font-family: Calibri;
    text-shadow: 0 0 1px black;
}

#add-button{
    cursor: pointer;
    border: 2px solid gray;
    border-radius: 0px 20px 0 0;
    padding: 10px 2px;
    background: linear-gradient(to bottom, rgb(0, 175, 180), lightblue);
}

#runit{
    cursor: pointer;
    border: 2px solid gray;
    border-radius: 0 0 20px 0;
    padding: 10px 2px;
    background: linear-gradient(to top, rgb(0, 175, 180), lightblue);
}

#newholder{
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    font-family: Tahoma;
    font-size: 16px;
}

input{
    color: white;
    margin-bottom: 3px;
}

.boxes{
    border: 1px solid lightgray;
    border-radius: 0 6px 6px 0;
    background: gray;
}

.boxes:hover{
    background: lightblue;
}

.boxes:focus{
    border-radius: 0 6px 6px 0;
    background: rgb(0, 175, 180);
}

#howmany{
    color: black;
}

Answer 1

var gate = 0;
var count = [];
var daLink = [];
function addAnInput(){
    document.getElementById("newholder").innerHTML += "Inser Link: <input class='boxes' id='gate" + gate.toString() + "' type='text' size='83' /><br />";
    count.push(gate);
    gate += 1;
}
function thisNow(){return Math.floor(Math.random() * daLink.length)};
function getValues(){
	var howMany = document.getElementById("howmany").value;
    daLink = [];
    for (var i = 0; i < count.length; i += 1){
        daLink.push(document.getElementById("gate" + i).value);
    };
    for (var i = 0; i <howMany; i += 1){
        var thisOne = thisNow();
        window.open(daLink[thisOne], "_blank");
    }
}

h1{
    width: 50%;
    color: white;
    font-family: Tahoma;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    border: 4px solid gray;
    border-radius: 0 20px 0 20px;
    background: linear-gradient(to bottom right, lightgray, lightblue);
    text-shadow: 0 0 3px black;
}

.separator{
    width: 70%;
    border-bottom: 1px solid lightgray;
    margin-left: auto;
    margin-right: auto;
}

.button-holder{
    color: white;
    font-size: 18px;
    width: 20%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    font-family: Calibri;
    text-shadow: 0 0 1px black;
}

#add-button{
    cursor: pointer;
    border: 2px solid gray;
    border-radius: 0px 20px 0 0;
    padding: 10px 2px;
    background: linear-gradient(to bottom, rgb(0, 175, 180), lightblue);
}

#runit{
    cursor: pointer;
    border: 2px solid gray;
    border-radius: 0 0 20px 0;
    padding: 10px 2px;
    background: linear-gradient(to top, rgb(0, 175, 180), lightblue);
}

#newholder{
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    font-family: Tahoma;
    font-size: 16px;
}

input{
    color: white;
    margin-bottom: 3px;
}

.boxes{
    border: 1px solid lightgray;
    border-radius: 0 6px 6px 0;
    background: gray;
}

.boxes:hover{
    background: lightblue;
}

.boxes:focus{
    border-radius: 0 6px 6px 0;
    background: rgb(0, 175, 180);
}

#howmany{
    color: black;
}

<html>
<head>
<title>DMA Link opener</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="jsmain.js"></script>
<link rel="stylesheet" type="text/css" href="cssmain.css" />
</head>
<body>

    <div class="title">
        <h1>DMA Link opener</h1>
    </div>

    <div class="separator"></div>

    <div class="content">
        <div class="button-holder">
            <p id="add-button" onClick="addAnInput()">Add Link</p>
            <p id="runit" onClick="getValues()">Run It</p>
            <input id="howmany" type="number" min="1" max="5" />
        </div>
        <form id="newholder"></form>
    </div>

    <div class="separator"></div>

</body>
</html>

所以是的，没有什么解释...... 1-代码在<head>上，因此它在加载正文之前运行，因此howMany被设置为null，因为没有元素。
2-每次运行时都会创建'thisNow'功能getValues这不是一个好的实践（实际上每次运行document.getElementById("newholder")时都不是addAnInput但是为了简单起见我离开了它那里。） 3-实际上从未调用函数thisNow，您正在为函数设置thisOne。 4- for for循环最好使用var i，因为只有i实际上设置了一个全局变量，它可能会导致错误。
5-在最后一个for循环howMany写了一个拼写错误howmany

无法正确推动价值

1 个答案: