JavaScript 逻辑没有遵循答案

【问题标题】：JavaScript logic not following throughJavaScript 逻辑没有遵循
【发布时间】：2015-08-10 12:32:15
【问题描述】：

我在 JavaScript 中有这个计算器，但逻辑没有按照正确的方式进行。我不知道是什么破坏了流量。问题是 rollRepeatCal 变量设置为 6，但我的“

这是我的价值观：

<div class="ProductProperties">
    <div class="PropertiesList">
        <asp:Panel ID="pnlProperties" runat="server">
            <h3><asp:Label ID="lblProductProperties" runat="server" Text="Product Properties" /></h3>
            <strong><a href="wallpaper-properties.aspx" target="blank"><font color="#FF0000">What are these?</font></a></strong><br />
            <strong>Material:</strong> <asp:Label ID="lblMaterial" runat="server" /><br />
            <strong>Paste:</strong> <asp:Label ID="lblPaste" runat="server" /><br />
            <strong>Repeat: </strong><label id="lblRepeat" type="number">6</label><br />
            <strong>Match: </strong><asp:Label ID="lblMatch" runat="server" /><br />
            <strong>Roll Width: </strong><label id="lblRollWidth" type="number">20.5</label><br />
            <asp:Label id="divSRL" runat="server"><strong>Single Roll Length: </strong><label id="lblSingleRollLength" type="number">16.5</label><br />
            <strong>Single Roll Coverage: </strong><label id="lblSingleRollCoverage" type="number">28 square feet</label><br />
            <strong>Single Roll MSRP: </strong>$<asp:Label ID="lblMSRP" runat="server" /><br />
            <strong>Washability: </strong><asp:Label ID="lblWashability" runat="server" /><br />
            <strong>Removability: </strong><asp:Label ID="lblRemovability" runat="server" /><br />
        </asp:Panel>
    </div>
</div>

我的 HTML：

<p><strong>Calculate how much to buy: </strong><label id="output"></label></p>
<table><tr><td id="Wall" align="right"></td></tr>
<tr>
<td><strong>Wall Width: </strong>(ft)</td><td><input type="text" id="wallWidth" width="40px" value=""></td>
</tr>
<tr>
<td><strong>Wall Height: </strong>(ft)</td><td><input type="text" id="wallHeight" width="40px" value=""></td>
</tr>
</table>
 <a href="javascript: void(0)" onClick="wallpapercalc()"><button>Calculate</button></a>

然后我有我的 JavaScript：

<script>

    function wallpapercalc(){

       var widthInput = +document.getElementById('wallWidth').value,
       heightInput = +document.getElementById('wallHeight').value,
       rollWidthCal = +document.getElementById('lblRollWidth').innerText.replace('"', ' '),
       rollLengthCal = +document.getElementById('lblSingleRollLength').innerText.replace("'", " "),
       rollRepeatCal = +document.getElementById('lblRepeat').value;     


            if (rollWidthCal > 15)
            {   
                if (rollRepeatCal = < 4 )
                {
                    var repeat10 = ((((rollWidthCal / 12)*rollLengthCal) * 2)) -
                    ((((rollWidthCal / 12)*rollLengthCal) * 2)) * .10;
                    var result = (widthInput * heightInput) / repeat10;

                        if (result <= 1) 
                        {
                            document.getElementById('output').innerText = 
                            Math.ceil(result) + " roll 10 of wallpaper";
                        }
                        else
                        {
                            document.getElementById('output').innerText = 
                            Math.ceil(result) + " rolls 10 of wallpaper";
                        }
                }
                else if (rollRepeatCal > 3 && rollRepeatCal < 13)
                {
                    var repeat20 = ((((rollWidthCal / 12)*rollLengthCal) * 2)) -
                    ((((rollWidthCal / 12)*rollLengthCal) * 2)) * .20;
                    var result = (widthInput * heightInput) / repeat20;
                    if (result <= 1) 
                        {
                            document.getElementById('output').innerText = 
                            Math.ceil(result) + " roll 20 of wallpaper";
                        }
                        else
                        {
                            document.getElementById('output').innerText = 
                            Math.ceil(result) + " rolls 20of wallpaper";
                        }

                }
                else
                {
                    var repeat30 = ((((rollWidthCal / 12)*rollLengthCal) * 2)) -
                    ((((rollWidthCal / 12)*rollLengthCal) * 2)) * .30;
                    var result = (widthInput * heightInput) / repeat30;
                    if (result <= 1) 
                        {
                            document.getElementById('output').innerText = 
                            Math.ceil(result) + " roll 30 of wallpaper";
                        }
                        else
                        {
                            document.getElementById('output').innerText = 
                            Math.ceil(result) + " rolls 30 of wallpaper";
                        }

                }

            }
            else
            {
                 var borderResult =  (widthInput / rollLengthCal); 
                 document.getElementById('output').innerText = Math.ceil(borderResult)  + " rolls of border wallpaper";

            }
    }


</script>

【问题讨论】：

如果（rollRepeatCal =
抱歉，这是之前编辑的错误。 if (rollRepeatCal
请提供Minimal, Complete, and Verifiable example。我试过你的代码，它工作正常（在我从上面添加了一些缺失的字段之后，请参见此处：jsfiddle.net/q0wcpjhk）
但重复字段不是输入。当我将您的示例更改为文本字段时，代码不起作用。
我刚刚在你的代码中看到它是一个标签，让我检查一下JSFiddle

标签： javascript html css logic weblogic-10.x

【解决方案1】：

问题出在这行代码中：

rollRepeatCal = +document.getElementById('lblRepeat').value;

lblRepeat 是一个标签，因此它没有value 属性。如果您更改该行使其改为读取innerText（就像您对lblRollWidth 或lblSingleRollLength 所做的那样），它应该会再次工作：

rollRepeatCal = +document.getElementById('lblRepeat').innerText;

你可以在这个 JSFiddle 上看到它：http://jsfiddle.net/q0wcpjhk/1/

【讨论】：