繁体   English   中英

如何使用JavaScript显示单选按钮的文本值

[英]How can I display a text value for radio buttons using javascript

我正在建立一个在线商店,客户可以在其中选择定制零件。 我对javascript还是很陌生,但是我设法创建了一个单选按钮列表,其中从每个部分中添加了价格。

我希望有一个框显示所有选择的选项,而不仅仅是总和。

我将文本包含在值中并使用了parseInt。 我可以用来从值中提取文本而不是数字吗?

到目前为止,我的代码:

<head>
    <script type="text/javascript">
        function DisplayPrice(price){
                        var val1 = 0;
                        for( i = 0; i < document.form1.part.length; i++ ){
                                if( document.form1.part[i].checked == true ){
                                        val1 = document.form1.part[i].value;
                                }
                        }

                        var val2 = 0;
                        for( i = 0; i < document.form2.part2.length; i++ ){
                                if( document.form2.part2[i].checked == true ){
                                        val2 = document.form2.part2[i].value;
                                }
                        }

        var val3 = 0;
                        for( i = 0; i < document.form3.part3.length; i++ ){
                                if( document.form3.part3[i].checked == true ){
                                        val3 = document.form3.part3[i].value;
                                }
                        }


                        var sum=parseInt(val1) + parseInt(val2) + parseInt(val3);
            document.getElementById('totalSum').value=sum;
        }
    </script>
</head>
<body>
    <form name="form1" id="form1" runat="server">
       <br>
       <input id="rdo_1" type="radio" value="0 1.8ghz2xAMD" name="part" checked="checked" onclick="DisplayPrice(this.value);">1.8Ghz Dual Core AMD
        <br>
        <input id="rdo_2" type="radio" value="50 2ghz2xAMD" name="part" onclick="DisplayPrice(this.value);">2Ghz Dual Core AMD
        <br>
    </form>Choose your memory:<br />
    <form name="form2" id="form2" runat="server">
        <br>
        <input id="rdo_1" type="radio" value="0 1333corsair1gb" name="part2" checked="checked" onclick="DisplayPrice(this.value);">1333 Corsair 1GB
        <br>
        <input id="rdo_2" type="radio" value="50 1333corsair2x1gb" name="part2" onclick="DisplayPrice(this.value);">1333 Corsair 2x1GB
        <br>
    </form>Choose your graphics card:<br />
    <form name="form3" id="form3" runat="server">
        <br />
        <input id="rdo_1" type="radio" value="0 5830ATI1gb" name="part3" checked="checked" onclick="DisplayPrice(this.value);">1GB ATI 5830
        <br />
        <input id="rdo_2" type="radio" value="50 5850ATI1gb" name="part3" onclick="DisplayPrice(this.value);">1GB ATI 5850
        <br />
        <input id="rdo_3" type="radio" value="75 5870ATI1gb" name="part3" onclick="DisplayPrice(this.value);">1GB ATI 5870
        <br />
    </form>
</body>

在此先感谢您提供的任何建议。

这些值似乎始终由空格分隔。 因此,您可以使用split()函数将值分为两部分,第一部分包含价格,第二部分包含文本。

var parts = value.split(" ");
var price = parseInt(parts[0]);
var text = parts[1];

也就是说,有更好/更巧妙的方法来满足功能要求,但这取决于您的学习。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM