查询在浏览器桌面上工作但在移动设备上不工作的移动代码javascript答案

【问题标题】：query mobile code javascript working in browser desktop but not in mobile查询在浏览器桌面上工作但在移动设备上不工作的移动代码javascript
【发布时间】：2014-01-10 20:30:17
【问题描述】：

我的代码有问题。在浏览器桌面上一切正常，但在移动设备上我必须点击 div #Resultat 才能显示结果。请告诉我我的代码有什么问题。我放了一个url，因为在 jsfiddle 中它可以工作，但这不是我想要的。

            <script type="text/javascript">
    $(document).delegate('#so2', 'pagebeforeshow', function(){       
    $(document).bind('click', '[data-role="controlgroup"]', function(){ 
    setTimeout(function () {displayVals(); },100);
    });
    $("#Resultat").on('click', function(event, ui) {
    displayVals();
    });
    function displayVals() {
    var so2Present = $("#so2present").val();
    var so2Voulu = $("#so2voulue").val();
    var volume = $("#volume").val();
    var unite = $("input[name='Unit']:checked").val();
    //var forme = $("input[name='Form']:checked").val();
    var summary = parseFloat(((so2Voulu - so2Present)*volume *1.5)*unite).toPrecision(3);
    $("#Resultat").html(summary); 
}
    });
</script>


<div data-role="page" id="so2">


            <div data-role="header" class="jqm-header" style="padding-top:20px; background:#4d4d4d;">
                <a href="#defaultpanel" class="navmenu-link" id="menu" style="margin-top:19px;" title="Navigation"></a>

            </div><!--/ header -->
            <div data-role="content">

<div data-role="fieldcontain">
<label for="slider" class="so2present">SO2 présent:</label></br>
    <input type="range" name="slider1" id="so2present" value="0" min="0" max="50" step="1" data-highlight="true" />
            <p></p>
        <label for="slider" class="so2voulue">SO2 voulue:</label></br>
    <input type="range" name="slider2" id="so2voulue" value="0" min="0" max="50" step="1" data-highlight="true" />
            <p></p>
        <label for="slider" class="volume">Volume:</label></br>
    <input type="range" name="slider1" id="volume" value="0" min="0" max="250" step="1" data-highlight="true" />
             <div >
                 <div id="Resultat" class="ui-body ui-body-d ui-corner-all"></div>
        <div data-role="fieldcontain">
          <div data-role="controlgroup" data-type="horizontal" id="unite">
            <input type="radio" name="Unit" id="Unit_0" value="1" />
            <label for="Unit_0">ML</label>
            <input type="radio" name="Unit" id="Unit_1" value="0.001" />
            <label for="Unit_1">L</label>
            <input type="radio" name="Unit" id="Unit_2" value="0.01" />
            <label for="Unit_2">G</label>
          </div>
          </div><!--/fieldcontain-->
       </div><!--/unite-->
                         </div><!--/content-->

        </div><!-- /page -->

【问题讨论】：

如果您默认选中其中一个单选按钮是否有帮助：

标签： javascript jquery-mobile

【解决方案1】：

问题已解决我已更改 .js 的 jquery 和 jquery mobile 版本现在，只是一个小问题是当您更改滑块的值时，您必须在输入中单击 2x 才能看到更新的结果。

【讨论】：