0

我有一个用于景观美化公司的简单面积计算器，它只能在 chrome、IE 和 Safari 中使用，但不能在 Firefox 中使用。有人可以告诉我问题可能是什么吗？我想这可能是一个js问题。

这是一个工作页面的链接：http: //tinyurl.com/calc1test1

这是html：

  <h4><span>Area Calculator</span></h4>
                            <div class="boxInfo contactForm">

                                      <div style="display:none"><input type="checkbox"         name="CampaignList_64585" checked="checked" value="on" /></div>
                                     <div>
                                         <label>Length:</label>
                                        <input type=text name="square_length" size="3" onChange="get_cubicyards();">
                                    </div>
                                    <div>
                                        <label>Width:</label>
                                        <input type=text name="square_width" size="3" onChange="get_cubicyards();">
                                    </div>
                                    <div>
                                        <label>Depth:</label>
                                         <input type=text name="square_depth" size="3" onChange="get_cubicyards();">
                                    </div>

                                <div class="calcbutton">

                                        <input id="contactSubmit" class="calcsubmit"  type="button" value="Get Amounts" onClick="get_cubicyards();">
                                </div>

                                    <div>
                                        <label>Cubic Yards:</label>
                                        <input type=text name="square_cuyard" onFocus="calculate_totals();this.blur();">
                                    </div>

这是JS：

 <script language="Javascript">
    function isValidInput(strString)
    {
        //String of valid characters
        var strValidChars = '0123456789.';
        var strChar;
        var blnResult = true;
        var decimalCount = 0;

        if (strString.length == 0) return false;

        //Test strString consists of valid characters listed above
        for (i = 0; i < strString.length && blnResult == true; i++)
        {   strChar = strString.charAt(i);
            if (strValidChars.indexOf(strChar) == -1)
            {   blnResult = false; }
            if (strChar == '.')
            { decimalCount++; }
        }

        if (decimalCount > 1)
        { blnResult = false; }

        return blnResult;
    }

    function get_cubicyards()
    {   var cubicyards;

                if(  (eval('document.all.square_depth.value')) && (!isValidInput(eval('document.all.square_depth.value')))  )
                {   alert('You must enter only numeric values.'); 
                    eval('document.all.square_cuyard.value = \'\'');
                    return false; 
                }
                if(  (eval('document.all.square_length.value')) && (!isValidInput(eval('document.all.square_length.value')))  )
                {   alert('You must enter only numeric values.');                   
                    eval('document.all.square_cuyard.value = \'\'');
                    return false; 
                }
                if(  (eval('document.all.square_width.value')) && (!isValidInput(eval('document.all.square_width.value')))  )
                {   alert('You must enter only numeric values.'); 
                    eval('document.all.square_cuyard.value = \'\'');
                    return false; 
                }

                //Only make calculations if there are valid values specified for ALL necessary fields
                if (  (eval('document.all.square_depth.value')) && (eval('document.all.square_length.value')) && (eval('document.all.square_width.value'))  )
                {   cubicyards = (eval('(document.all.square_depth.value * document.all.square_length.value * document.all.square_width.value)/324')*1000)/1000;
                    eval('document.all.square_cuyard.value = '+cubicyards);
                    return true;
                }


    }
</script>
4

3 回答 3

2

您正在使用 document.all 这不在 w3c 标准中。您可以将 id 添加到输入字段，然后使用 w3c 标准获取它们的值：

document.getElementById('[id name here]')
于 2013-04-15T17:27:07.137 回答
0

if( (eval('document.all.square_depth.value')) && (!isValidInput(eval('document.all.square_depth.value'))) )

快速的回答是 Firefox 不支持document.all.

但是，嗯，长答案是这段代码不完整。您可能想要插入form标签，以便您可以执行跨浏览器代码，例如...

<form name='myForm'>
    <h4>Area Calculator</h4>
    <div class="boxInfo contactForm">
        <div style="display:none"><input type="checkbox" name="CampaignList_64585" checked="checked" value="on" /></div>
        <div>
            <label>Length:</label>
            <input type="text" name="square_length" size="3" onchange="get_cubicyards();">
        </div>
        <div>
            <label>Width:</label>
            <input type="text" name="square_width" size="3" onchange="get_cubicyards();">
        </div>
        <div>
            <label>Depth:</label>
            <input type="text" name="square_depth" size="3" onchange="get_cubicyards();">
        </div>
        <div class="calcbutton">
            <input id="contactSubmit" class="calcsubmit" type="button" value="Get Amounts" onclick="get_cubicyards();">
        </div>

        <div>
            <label>Cubic Yards:</label>
            <input type="text" name="square_cuyard" onfocus="calculate_totals();this.blur();">
        </div>
    </div>
</form>

...

function get_cubicyards() { 
    var cubicyards,
        myForm = document.forms['myForm'];

    if (isNaN(myForm.elements['square_length'].value ))    {
        alert('You must enter only numeric values.'); 
    } else {
        // ... more checks and logic                
    } 
}

老实说，对于跨浏览器不友好的代码，其他人已经指出这种奇怪的用法，不，潜在的矫枉过正，无缘无故的嵌套等等，你可能会真正受益于放慢速度并遵循一些介绍性教程（这个不是很好，但只是一个开始）在问太多问题之前。evalisNaNdivspanh4

我们都从某个地方开始！祝你好运。

于 2013-04-15T17:28:02.867 回答
0

Firefox 控制台显示此错误：

[10:26:13.365] TypeError: document.all is undefined @ http://kynock.wildwingdesign.com/calctest:72

您不能document.all在 Firefox 中使用。这里真正的问题是你的 javascript 真的很糟糕。这里应该不需要，eval()现在应该需要document.all. 只需给您的每个输入一个id值并使用它documentGetElementById('yourId').value来获取存储在输入中的值。

于 2013-04-15T17:29:43.930 回答