0

我正在尝试创建一个动态的 java 脚本移动测验，用户可以在其中动态地为单个问题添加另一个（多个）答案，例如“你最喜欢的水果是什么？”

我在这里看到了 JavaScript 的示例：Javascript Add Dynamic Input Field

但是我还没有看到在用户单击“提交并添加另一个水果”按钮后会删除输入字段的任何示例，以便他们可以输入：（在移动设备上工作）

  • 苹果，点击提交并添加另一个水果
  • 梨，单击提交并添加另一个水果
  • 橙子，单击提交并添加另一个水果
  • 猕猴桃，点击提交到下一个问题

我在想动态创建的输入字段名称是 question11.01, question11.02, question11.03, question11.04 或 question/part: q001p1, q001p2, q001p3, q001p4

该解决方案还需要使用返回提交按钮，以防用户意识到他不想将梨添加为第二个水果并将其更改为香蕉

我在用户“提交到下一个问题”之后隐藏了 div，然后使用 javascript 使下一个问题 div 可见，以在移动设备中提供下一页效果，用户觉得他正在参加一个动态测验，你会在DMV 计算机测试

<div class="questionquiz11" >



    <h2>Question 11</h2>
 <HR>

    <p>What is your favorite fruit(s)?   </p>

    <input type=text name="question11.01" >

 <BR> 

    <input type=submit id="backbutton"    value="Back">

    <input type=submit id="button"    value="Submit to next question">

    <input type=submit id="addfruit"  value="Submit and Add Another Fruit">



</div>



<div class="questionquiz12" style="display: none">



    <h2>Question 12</h2>
 <HR>

    <p>What is your favorite veggies(s)?   </p>

    <input type=text name="question12.01" >

 <BR> 

    <input type=submit id="backbutton"    value="Back">

    <input type=submit id="button"    value="Submit to next question">

    <input type=submit id="addveggies"  value="Submit and Add Another Veggie">



</div>

更新：可能动态创建一个 div 类型的示例代码（用它做一些测试）

  var newdiv = document.createElement('div');
          newdiv.innerHTML = "Entry " + (counter + 1) + " <br><input type='text' name='myInputs[]'>";
          document.getElementById(divName).appendChild(newdiv);
          counter++;
4

1 回答 1

0

如果您想要同时具备添加输入字段和在问题之间导航的功能，请首先通过 mkyong 在<div>. 您可以通过将 jQuery.append(...)函数与附加内的另一个输入框一起使用来完成此操作。

当用户导航到下一个问题.hide()时<div>，问题.show()的和<div>下一个问题的。

于 2012-10-02T15:18:46.540 回答