Javascript自动计算无法在FF中运行，在IE和Chrome中可以正常运行

Question

I have the following asp.net textbox defined in markup:

<div class="OptionSelect2">
    <asp:TextBox ID="txtCalculateWeightRollSize" CssClass="_100" runat="server"></asp:TextBox>
</div>

In the code-behind, on Page_Load, I am binding the onblur event:

txtCalculateWeightRollSize.Attributes.Add("onblur", "Javascript:RollBWghtPCutoffNWebsCalcs();")

The Javascript (reformatted to more easily to fit into a question format), is as such:

function RollBWghtPCutoffNWebsCalcs() { ZeroPctLbs(); }
function ZeroPctLbs() {
    //Get the values
    var rollSize = document.getElementById("<% =txtCalculateWeightRollSize.ClientID %>").value.replace("$", "").replace("%", "");
        //Get other controls' values

    //Make them numbers, if necessary
    rollSize = +rollSize;
        //convert other controls

    //Calculate and assign the result
    var result = //math;
    document.getElementById("<% =lblCalculateWeightZeroPercentLbsValue.ClientID %>").innerText = result;
}

This works without a problem in both IE and Chrome. However, in Firefox, it fails. In firebug (which I have not used until today), it appears that the onblur event fires, but stepping into the code, when it should be calling RollBWghtPCutoffNWebsCalcs(), it passes over it as though the calling doesn't exist. If I place a breakpoint directly inside any of the Javascript functions, it is never triggered.

The textbox appears to be rendered correctly in HTML:

<input name="ctl00$MainContent$txtCalculateWeightRollSize" type="text" id="MainContent_txtCalculateWeightRollSize" class="_100" onblur="Javascript:RollBWghtPCutoffNWebsCalcs();" />

Here is a JSFiddle that I believe shows the issue. The onblur doesn't work in any browser in the fiddle, but that would be consistent with my experience with Firefox issues in the past. It does work in Chrome and IE when rendered directly, and JSHint indicates that the Javascript is valid.

I suspect something I'm doing isn't completely standard, as Firefox (by my understanding) is pretty much a standards-based web experience. WHY WON'T IT RUN? Please.

Answer 1

Sometimes it's the simple things...

.innerText isn't supported by FireFox. Use innerHTML instead.

Once I stopped using Firebug and switched to FF's built-in debugger, I was able to actually trace my code - I guess I just don't know how to use Firebug. The odd thing that threw me off was that FF would get the values FROM the labels using innerText, and would write them in such a way that subsequent function calls could read the written values, but it would not render the innerText.

tldr;

Use innerHTML to work with label text in Javascript.