Question

我有一个表单有数百个输入和元素，用于从用户那里获取考试，我必须输入每个输入的ID和名称

我该如何防止这种情况？有没有javascript的解决方案？

<ol>
        <li>
            <div class="qselections">
                <input type="radio" value="1" id="1" name="question1"><label for="1">1</label>
                <input type="radio" value="2" id="2" name="question1"><label for="2">2</label>
                <input type="radio" value="3" id="3" name="question1"><label for="3">3</label>
                <input type="radio" value="4" id="4" name="question1"><label for="4">4</label>
            </div>
        </li>
        <br>


        <li>
            <div class="qselections">
                <input type="radio" value="1" id="5" name="question2"><label for="5">1</label>
                <input type="radio" value="2" id="6" name="question2"><label for="6">2</label>
                <input type="radio" value="3" id="7" name="question2"><label for="7">3</label>
                <input type="radio" value="4" id="8" name="question2"><label for="8">4</label>
            </div>
        </li>
        <br>


.
.
.
.
.


        <li>
            <div class="qselections">
                <input type="radio" value="1" id="1197" name="question300"><label for="1197">1</label>
                <input type="radio" value="2" id="1198" name="question300"><label for="1198">2</label>
                <input type="radio" value="3" id="1199" name="question300"><label for="1199">3</label>
                <input type="radio" value="4" id="1200" name="question300"><label for="1200">4</label>
            </div>
        </li>
        <br>


</ol>

Answer 1

您可以使用for循环动态生成元素。在这种情况下，您无需担心ID和名称。

复制此代码并粘贴到index.html文件，然后在Chrome浏览器中打开该文件。

<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    <meta charset="utf-8">
    <title>Test</title>
    <meta name="description" content="Fullscreen backgrounds with centered content">
</head>

<body>

<ol id="questionArea"></ol>

</body>
<script type="text/javascript">
    var settings={
        questionCount:5,
        subQuestionCount:4
    };

    var htmlString="";
    var uniqueId = 1;
    for(var i=0;i<settings.questionCount;i++){
        htmlString += "<li><div class='qselections'>";
        for(var j=1;j<=settings.subQuestionCount;j++){
            htmlString +="<input type='radio' value='"+j+"' id='"+ uniqueId +"' name='question"+ i +"'><label for='"+ uniqueId +"'"+">"+j+"</label>";
           uniqueId++;
        }
        htmlString += "</div></li>"
    }

    $(questionArea).html(htmlString);
</script>
</html>

输入和元素的多个id和名称

1 个答案: