javascript自动计算总价并输出

不会javascript，求帮忙写javascript自动取值计算总价并输出的代码。谢谢html，取<select name='us_p'>*<select name='goods_count'>=总价，并输出到页面<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<html>
<head>
<title>test</title>
</head>
<body>
<select name='us_p'>
<option value='10'>包月卡（30天）</option>
<option value='30'>季度卡（90天）</option>
<option value='60'>半年卡（180天）</option>
        <option value='100'>包年卡（365天）</option>
    </select>
    連接數
    <select name='goods_count'>
        <option value='1'>1</option>
        <option value='2'>2</option>
        <option value='3'>3</option>
        <option value='4'>4</option>
        <option value='5'>5</option>
        <option value='6'>6</option>
        <option value='7'>7</option>
        <option value='8'>8</option>
        <option value='9'>9</option>
        <option value='10'>10</option>
    </select>個
</body>
</html>

解决方案 »

  1.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <head>
    <script language="JavaScript"> 
    onload = function(){
    var p = document.getElementById('us_p');
    var c = document.getElementById('goods_count');
    var t = document.getElementById('total');
    t.innerHTML = Math.round(parseFloat(p.options[p.selectedIndex].value, 10) * parseFloat(c.options[c.selectedIndex].value, 10) * 100) /100;
    p.onchange = c.onchange = function(){
    var p = document.getElementById('us_p');
    var c = document.getElementById('goods_count');
    var t = document.getElementById('total');
    t.innerHTML = Math.round(parseFloat(p.options[p.selectedIndex].value, 10) * parseFloat(c.options[c.selectedIndex].value, 10) * 100) /100;
    }
    }
    </script>
    </head>
    <html>
        <head>
            <title>test</title>
        </head>
        <body>
        <select name='us_p'>
            <option value='10'>包月卡（30天）</option>
            <option value='30'>季度卡（90天）</option>
            <option value='60'>半年卡（180天）</option>
            <option value='100'>包年卡（365天）</option>
        </select>
        連接數
        <select name='goods_count'>
            <option value='1'>1</option>
            <option value='2'>2</option>
            <option value='3'>3</option>
            <option value='4'>4</option>
            <option value='5'>5</option>
            <option value='6'>6</option>
            <option value='7'>7</option>
            <option value='8'>8</option>
            <option value='9'>9</option>
            <option value='10'>10</option>
        </select>個
    总价：<span id="total"></span>
        </body>
    </html>
      

  2.   

    感谢您的回复，使用您的代码无法输出总价。下面是我参照其它人写的代码，能输出总价，但是必须点一下文本框。
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <html>
    <script   language="javascript">   
    function showprice(){
    var price = document.getElementById("us_p");
         var count = document.getElementById("goods_count");
         var alltotal = document.getElementById('alltotal');
         alltotal.value = parseInt(price.value,10) * parseInt(count.value,10);
    }  
    </script>
    <head>
    <title>test</title>
    </head>
    <body>
    <select id='us_p' name='us_p'>
    <option value='10'>包月卡（30天）</option>
    <option value='30'>季度卡（90天）</option>
    <option value='60'>半年卡（180天）</option>
            <option value='100'>包年卡（365天）</option>
        </select>
        連接數
        <select id='goods_count' name='goods_count'>
            <option value='1'>1</option>
            <option value='2'>2</option>
            <option value='3'>3</option>
            <option value='4'>4</option>
            <option value='5'>5</option>
            <option value='6'>6</option>
            <option value='7'>7</option>
            <option value='8'>8</option>
            <option value='9'>9</option>
            <option value='10'>10</option>
        </select>個
        <input type="text" id="alltotal" name="alltotal" onfocus="showprice();" />
        总价：<span id="alltotal"></span>
    </body>
    </html>
      

  3.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <html>
        <head>
            <title>test</title>
        </head>
        <body>
        <select id='us_p' name='us_p'>
            <option value='10'>包月卡（30天）</option>
            <option value='30'>季度卡（90天）</option>
            <option value='60'>半年卡（180天）</option>
            <option value='100'>包年卡（365天）</option>
        </select>
        連接數
        <select id='goods_count' name='goods_count'>
            <option value='1'>1</option>
            <option value='2'>2</option>
            <option value='3'>3</option>
            <option value='4'>4</option>
            <option value='5'>5</option>
            <option value='6'>6</option>
            <option value='7'>7</option>
            <option value='8'>8</option>
            <option value='9'>9</option>
            <option value='10'>10</option>
        </select>個
    <script>
    function jisuan(){
       var a=document.getElementById("us_p").value;
       var b=document.getElementById("goods_count").value;
       var c=a*b;
    document.write(c);
    }
    window.onload=jisuan();
    </script>    </body>
    </html>
      

  4.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <meta http-equiv="Content-Type" content="text/html; charset=gbk" />
    <head>
    </head>
    <html>
        <head>
            <title>test</title>
        </head>
        <body>
        <select name='us_p' id="us_p">
            <option value='10'>包月卡（30天）</option>
            <option value='30'>季度卡（90天）</option>
            <option value='60'>半年卡（180天）</option>
            <option value='100'>包年卡（365天）</option>
        </select>
        連接數
        <select name='goods_count' id="goods_count">
            <option value='1'>1</option>
            <option value='2'>2</option>
            <option value='3'>3</option>
            <option value='4'>4</option>
            <option value='5'>5</option>
            <option value='6'>6</option>
            <option value='7'>7</option>
            <option value='8'>8</option>
            <option value='9'>9</option>
            <option value='10'>10</option>
        </select>個
    总价：<span id="total"></span>
        </body>
    <script language="JavaScript"> 
    window.onload = function(){
        var p = document.getElementById('us_p');
        var c = document.getElementById('goods_count');
        var t = document.getElementById('total');
    alert(p);
        t.innerHTML = Math.round(parseFloat(p.options[p.selectedIndex].value, 10) * parseFloat(c.options[c.selectedIndex].value, 10) * 100) /100;
        p.onchange = c.onchange = function(){
            var p = document.getElementById('us_p');
            var c = document.getElementById('goods_count');
            var t = document.getElementById('total');
            t.innerHTML = Math.round(parseFloat(p.options[p.selectedIndex].value, 10) * parseFloat(c.options[c.selectedIndex].value, 10) * 100) /100;
        }
    }
    </script></html>
      在1楼的基础上改了下 1楼的 不支持 火狐 ..  
      

  5.   

    您好，我是整个代码copy测试的，http://219.128.253.242:8888/test2.html
      

  6.   

    p   和  c 都是 null  你就没有 id 叫那个 名称的  
      

  7.   

    非常感谢您的代码，可以正常计算并输出了，但是第一次打开网页会提示[object HTMLSelectElement]。
      

  8.   

      哦 我刚才 测试  来着 你把那个 alert 那行删了 就行 
      

  9.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <html>
        <head>
            <title>test</title>
        </head>
        <body>
        <select id='us_p' name='us_p' onChange="jisuan()">
            <option value='10'>包月卡（30天）</option>
            <option value='30'>季度卡（90天）</option>
            <option value='60'>半年卡（180天）</option>
            <option value='100'>包年卡（365天）</option>
        </select>
        連接數
        <select id='goods_count' name='goods_count'onChange="jisuan()">
            <option value='1'>1</option>
            <option value='2'>2</option>
            <option value='3'>3</option>
            <option value='4'>4</option>
            <option value='5'>5</option>
            <option value='6'>6</option>
            <option value='7'>7</option>
            <option value='8'>8</option>
            <option value='9'>9</option>
            <option value='10'>10</option>
        </select>個
    <div id="price"></div><script>
    function jisuan(){
       var a=document.getElementById("us_p").value;
       var b=document.getElementById("goods_count").value;
       var c=a*b;
    document.getElementById("price").innerHTML="总计："+c;
    </script>    </body>
    </html>