Question

我正在一个网站上工作，他的一个功能是计算用户GPA。因此，我让用户动态地输入课程并输入每门课程的成绩和学分。这是代码：

      var countBox = 1;
      var boxName = 0;

      function addCourse() {
        var box1Name = "Course " + countBox;
        var box2Name = "Grade ";
        var box4Name = "Hours ";
        document.getElementById('responce').innerHTML += <br/>
        <input type="text"  + box1Name + " " + value=" " + box1Name + " " />
        <input type="text" id="box2Name" + box2Name + " " + value= " " + box2Name + " "/>
        <select onchange="ChooseContact(this)" style="margin-right: 0.5em";> 
           <option value="95">A+ </option> 
           <option value="90">A </option> 
           <option value="85">B+ </option>
           <option value="80">B </option>
           <option value="75">C+ </option>
           <option value="70">C </option>
           <option value="65">D+ </option>
           <option value="60">D </option>
           <option value="59">F </option >
         </select ><input type="text"  + box4Name + " " value= " " + box4Name + " "   />  <br/>';
        countBox += 1;
      }

      function ChooseContact(data) {

        document.getElementById("box2Name").value = data.value;

      }

<button type="submit" onclick="addCourse()">Add New Course</button>
<br></br>

<span id="responce"></span>

每当用户输入新课程时，将出现四个框： 1门课程名称 2级（按数字） 3-下拉列表包含成绩（A +，A，B +，B ......等）。 4学分

我希望当用户输入A +时，第二个框的值更改为95，当他输入A时，值更改为90，依此类推。每当我进入一门课程时，它对我有用，但当用户输入两门课程并改变第二门课程的价值时，第一门课程的价值就会改变。

任何人都有解决这个问题的方法吗？

Answer 1

你需要在这些多行中添加反引号，你可以选择带<div id="wrapper"> <div class="scrollmenu"> <a href="#home">Week 1</a> <a href="#news">Week 2</a> <a href="#contact">Week 3</a> <a href="#about">Week 4</a> <a href="#support">Week 5</a> <a href="#blog">Week 6</a> <a href="#tools">Week 7</a> <a href="#base">Week 9</a> <a href="#custom">Week 10</a> <a href="#more">Week 11</a> <a href="#logo">Week 12</a> <a href="#friends">Week 13</a> <a href="#partners">Week 14</a> <a href="#people">Week 15</a> <a href="#work">Week 16</a> <a href="#home">Week 17</a> <a href="#news">Week 18</a> <a href="#contact">Week 19</a> <a href="#about">Week 20</a> <a href="#support">Week 21</a> <a href="#blog">Week 22</a> <a href="#tools">Week 23</a> <a href="#base">Week 24</a> <a href="#custom">Week 25</a> <a href="#more">Week 26</a> </div> </div>的prev元素来更改值，也可以在插入新元素时保留最后一个元素previousElementSibling而不是insertAdjacentHTML：

＆＃13;

innerHTML

＆＃13;

var countBox =1;
  var boxName = 0;
  function addCourse()
  {
    var box1Name="Course "+countBox; 
    var box2Name="Grade ";
    var box4Name="Hours ";
    document.getElementById('responce').insertAdjacentHTML('beforeend', `<br/>
    <input type="text" id="'+box1Name+'" value="'+box1Name+'" " />
    <input type="text" id="box2Name"'+box2Name+'" value="'+box2Name+'" "/>
    <select onchange="ChooseContact(this)" style="margin-right: 0.5em";> 
       <option value="95">A+ </option> 
       <option value="90">A </option> 
       <option value="85">B+ </option>
       <option value="80">B </option>
       <option value="75">C+ </option>
       <option value="70">C </option>
       <option value="65">D+ </option>
       <option value="60">D </option>
       <option value="59">F </option >
     </select ><input type="text" id="'  + box4Name + '" value="' + box4Name + '"   />  <br/>`);
 countBox += 1;
}

   function ChooseContact(data) {
     data.previousElementSibling.value = data.value;
   }

＆＃13;

在javascript中更改文本框的值

1 个答案: