Jquery移动选择输入

时间:2012-09-27 22:56:28

标签: android jquery jquery-mobile

jQuery移动选择菜单,表单计算器可以在浏览器Firefox中运行,但不能在android中运行。当在浏览器中点击提交按钮时它按预期工作但当我在android中执行时,微调器加载并发送回我的主页。

            <form id="thermalgrowth">
                <div data-role="fieldcontain">
                    <fieldset data-role="controlgroup">
                        <label for="t">
                            T:
                        </label>
                        <input id="t" placeholder=""  name="t" value="" type="number" step="0.001" min="0"/>
                    </fieldset>
                </div>
                <div data-role="fieldcontain">
                    <fieldset data-role="controlgroup">
                        <label for="l">
                            L:
                        </label>
                        <input id="l" placeholder=""  name="l" value="" type="number" step="0.001" min="0"/>
                    </fieldset>
                </div>


                <div data-role="fieldcontain">  
                    <label for="c" class="select">C:</label>                    
                        <select name="c" id="c" >
                            <option value=".000006">Carbon Steel</option>
                            <option value=".0000059">Cast Iron</option>
                            <option value=".0000095">Stainless Steel</option>
                            <option value=".0000073">Nickel Steel</option>
                            <option value=".00001">Bronze</option>
                        </select>
                </div>                  

                <div class="ui-grid-a">
                    <div class="ui-block-a"><button id="reset" type="reset" data-theme="c" name="reset">Reset</button></div>
                    <div class="ui-block-b"><button id="submit" type="submit" data-theme="b" name="submit" >Submit</button></div>
                </div>

                <div data-role="fieldcontain">
                    <fieldset data-role="controlgroup">
                        <label for="tg">
                            Thermal Growth
                        </label>
                        <input id="tg" placeholder=""  name="tg" type="number" disabled="disabled"/>
                    </fieldset>
                </div>

                <script type="text/javascript"><!--

                    function calculate () {

                        var t = $('#t').val();
                        var l = $('#l').val();
                        var c = $('#c').val();                  

                        var tg = Number(t) * l * c ;

                        $('#tg').val( tg.toFixed(3) );

                        // submit event functions must return false,
                        // to tell the browser not to load a new page.
                        return false;
                    }

                    $('#thermalgrowth').submit( calculate );
                    $('#reset').click(function() {
                        $('#t').val('0').number('refresh');
                        $('#l').val('0').number('refresh');
                        $('#tg').val('0').number('refresh');
                    });

                </script>
            </form>         

2 个答案:

答案 0 :(得分:0)

您是否尝试过删除脚本元素中的<!--内容?这可能会导致问题。

答案 1 :(得分:0)

拉​​诺,

我猜是存在解析错误或运行时错误。未公开的<!--可能是一个问题。控制台应该告诉你。

我们应该Number()使用t而不是其他两个值。自动类型转换应该处理它,但至少为了完整性,你可以尝试:

var tg = Number(t) * Number(l) * Number(c) ;

您也可以尝试将整个内容包装在$(function(){...})中并将其放入文档<head>中。