Fatal编程技术网

Html/javascript表单计算问题

javascript html arrays forms math

Html/javascript表单计算问题,javascript,html,arrays,forms,math,Javascript,Html,Arrays,Forms,Math,我是新的网站编码，我真的很挣扎！我正在尝试将不同选择菜单选项中的选择值添加到一个总数中，该总数将为我提供一个数字，我可以将其添加到自由文本框中输入的数字中 我在网上和这个网站上进行了广泛的搜索，找到了一些相似的例子，但是当我尝试这些例子时，它们对我的添加/更改不起作用 任何帮助都将不胜感激！下面是我的html和javascript 提前谢谢 <!doctype html> <html> <head> <meta charset="UTF-8"> &

我是新的网站编码，我真的很挣扎！我正在尝试将不同选择菜单选项中的选择值添加到一个总数中，该总数将为我提供一个数字，我可以将其添加到自由文本框中输入的数字中

我在网上和这个网站上进行了广泛的搜索，找到了一些相似的例子，但是当我尝试这些例子时，它们对我的添加/更改不起作用

任何帮助都将不胜感激！下面是我的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


无标题文件


运动
网球
高尔夫球
足球
橄榄球
马球
击剑
游泳




星座
白羊座
金牛座
双子座
巨蟹座
狮子座
处女座
天秤座
天蝎座
人马座
摩羯座
水瓶座
双鱼座






爱好
爱好
很多
一些
很少的

函数中的None如果您总是希望值中包含整数，则用parseInt替换Number，否则用parseFloat替换Number。
除非我误解了您的意图，否则您可以直接使用函数：


Array.reduce（函数（previousValue、currentValue、index、Array）{
返回上一个值+当前值；
})；

所以对你来说：


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
}



不知道你到底在追求什么，也不知道“分数”是什么意思，但总数应该等于总数。
在浏览器中查找并使用错误控制台，这会让你了解错误发生的位置。发生在不同浏览器中菜单的不同区域。在菜单中查找“开发者”。您好，我尝试了，但没有似乎在做任何事情。我应该分配一个document.write还是alert？我希望它将结果发布到新的浏览器页面上。如果我没有什么意义，很抱歉！