Question

我是网站编码的新手，我真的很挣扎！我试图将不同选择菜单选项中的选择值添加到总数中，这样我就可以添加一个数字，我可以添加到自由文本框中输入的数字中。

我已经在网上和本网站上进行了广泛搜索，并找到了类似的例子，但是当我尝试了它们时，它不适用于我的添加/更改！

任何帮助将不胜感激!!!!下面是我的HTML和javascript。

提前致谢！

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>

<script type="text/javascript" src="example.js"></script>


</head>

<form action="" id="myform" onsubmit="return false;">
        <div class="cont_order">

<div data-role="fieldcontain">
          <label for="selectmenu" class="select">
            <div align="right"></div>
          </label>
          <div align="center"></div>
    </div>
        <div align="center">
          </p>


          <select name="Sport" id="Sport" data-native-menu="false" data-theme="a" onchange="calculateTotal()">
            <option value="0">Sport</option>
            <option value="Tennis">Tennis</option>
            <option value="Golf">Golf</option>
            <option value="Soccer">Soccer</option>
            <option value="Rugby">Rugby</option>
            <option value="Polo">Polo</option>
            <option value="Fencing">Fencing</option>
            <option value="Swimming">Swimming</option>
          </select>

          <br/>


          <label for="selectmenu" class="select">
            <div align="right"></div>
          </label>
          <div align="center"></div>
    </div>
        <div align="center">
          </p>


          <select name="Star Sign" id="SS" data-native-menu="false" onchange="calculateTotal()">
            <option value="0">Star Sign</option>
            <option value="1.5">Aries</option>
            <option value="3">Taurus</option>
            <option value="1.5">Gemini</option>
            <option value="2">Cancer</option>
            <option value="3">Leo</option>
            <option value="1.5">Virgo</option>
            <option value="2">Libra</option>
            <option value="3">Scorpio</option>
            <option value="2">Sagittarius</option>
            <option value="1.5">Capricorn</option>
            <option value="0.5">Aquarius</option>
            <option value="0.5">Pisces</option>
          </select>

<br/>


          <label for="selectmenu" class="select">
            <div align="right"></div>
          </label>
          <div align="center"></div>
    </div>
        <div align="center">
          </p>

          <br/>

          <select name="Hobby" id="Hobby" data-native-menu="false" onchange="calculateTotal()">Hobby
            <option value="0">Hobby</option>
            <option value="A lot">A lot</option>
            <option value="Some">Some</option>
            <option value="Few">Few</option>
            <option value="None">None</option
          </select> 
    </div>

    <br/>

          <label for="selectmenu" class="select">
            <div align="right"></div>
          </label>
          <div align="center"></div>
      </div>
        <div align="center">
          </p>

          <br/>


          <select name="Favourite Colour" id="FC" data-native-menu="false" onchange="calculateTotal()">
            <option value="0">Favourite Colour</option>
            <option value="1.5">Black</option>
            <option value="3">Blue</option>
            <option value="1.5">Brown</option>
            <option value="2">Green</option>
            <option value="3">Orange</option>
            <option value="1.5">Pink</option>
            <option value="2">Purple</option>
            <option value="3">Red</option>
            <option value="2">Yellow</option>
            <option value="1.5">White</option>
            <option value="4">Other</option>

          </select>

          <br/>

        <p>&nbsp;     

 <br/>



    <div data-role="fieldcontain">
          <label for="Age">
            <div align="center">Age
              :
            </div>
          </label>
          <div align="center">
            <input type="number" name="Age" id="Age" value=""  />
          </div>
      </div>
      </form>
        <p>&nbsp;</p>

        <p>&nbsp;<a href="#" data-role="button">    <input type='submit' id='Submit' value='submit' onclick="calculateTotal()"/>

        <br/>
        </div>

        </form>




</div>


</body>
</html>



// JavaScript Document

var Sport = new Array();
Sport["Tennis"]=1.5;
Sport["Golf"]=3;
Sport["Soccer"]=2;
Sport["Rugby"]=3;
Sport["Polo"]=1.5;
Sport["Fencing"]=2;
Sport["Swimming"]=3; 

var SS = new Arr4ay();
Star_Sign["Aries"]=1.5;
Star_Sign["Taurus"]=3;
Star_Sign["Cancer"]=2;
Star_Sign["Leo"]=3;
Star_Sign["Virgo"]=1.5;
Star_Sign["Libra"]=2;
Star_Sign["Scorpio"]=3;
Star_Sign["Sagittarius"]=2;
Star_Sign["Capricorn"]=1.5;
Star_Sign["Aquarius"]=0.5;
Star_Sign["Pisces"]=1.5;

var Hobby = new Array();
Hobby["A lot"]=0.5;
Hobby["Some"]=1;
Hobby["Few"]=1;
Hobby["None"]=2;


var FC = new Array();
Favourite_Colour["Blue"]=3;
Favourite_Colour["Brown"]=1.5;
Favourite_Colour["Green"]=2;
Favourite_Colour["Orange"]=3;
Favourite_Colour["Pink"]=1.5;
Favourite_Colour["Purple"]=2;
Favourite_Colour["Red"]=3;
Favourite_Colour["Yellow"]=2;
Favourite_Colour["White"]=1.5;
Favourite_Colour["Other"]=4;


function calc() {
    var Sport = Number(document.getElementsById("Sport").value);
    var SS = Number(document.getElementsById("SS").value);
    var Hobby = Number(document.getElementsById("Hobby").value);
    var FC = Number(document.getElementsById("FC").value);
    var Age = Number(document.getElementsById("Age").value);

    var total = Sport + SS + Hobby + FC;

    var Score = Age = Score


}// JavaScript Document

Answer 1

在你的函数calc中，如果你总是期望从你的值或parseFloat得到一个整数，则将number替换为parseInt。

Answer 2

除非我误解了您在使用Array.reduce功能之后所做的事情：

Array.reduce(function(previousValue, currentValue, index, array){ return previousValue + currentValue; });

所以对你：

function calc() {
new tempAry = [
  Number(parseInt (document.getElementsById("Sport").value),10),
  Number(parseInt (document.getElementsById("SS").value),10),
  Number(parseInt (document.getElementsById("Hobby").value),10),
  Number(parseInt (document.getElementsById("FC").value),10)
];


var total = tempAry.reduce(function(previousValue, currentValue, index, array){
    return previousValue + currentValue;
});

//No idea what these are for
//var Age = Number(document.getElementsById("Age").value);
//var Score = Age = Score
}

不确定你到底是什么，也不确定“得分是什么意思”，但总数应该等于总数。

Html / javascript表单计算问题

2 个答案: