Javascript 单击功能在没有页面刷新的情况下不会启动_Javascript_Jquery_Events_Jquery Mobile_Click

Javascript 单击功能在没有页面刷新的情况下不会启动

javascript jquery events jquery-mobile

Javascript 单击功能在没有页面刷新的情况下不会启动,javascript,jquery,events,jquery-mobile,click,Javascript,Jquery,Events,Jquery Mobile,Click,好的，我已经多次看到这个问题，甚至解决方案也不适用于其他用户。但没有一个能满足我的需要简而言之，我使用Jquery Mobile作为触摸屏桌面浏览器应用程序的UI 我的索引页面只包含2个jqm页面（#page1，#page2），每个单击事件在DOM就绪函数中都可以正常工作。但是，当我在第2页之后通过 $.mobile.changePage("newPage.php?param1=1&param2=2"), { transition : "slide"} ); 参数可以很好地传递，但是

好的，我已经多次看到这个问题，甚至解决方案也不适用于其他用户。但没有一个能满足我的需要

简而言之，我使用Jquery Mobile作为触摸屏桌面浏览器应用程序的UI

我的索引页面只包含2个jqm页面（#page1，#page2），每个单击事件在DOM就绪函数中都可以正常工作。但是，当我在第2页之后通过

$.mobile.changePage("newPage.php?param1=1&param2=2"), { transition : "slide"} );

参数可以很好地传递，但是，如果不需要刷新页面，我的所有单击事件现在都无法工作。当我重新加载页面时，所有内容都很重要，但是我再次注意到，如果我从外部页面导航回索引页面，我仍然会遇到同样的问题，除非完成刷新

任何洞察都将不胜感激……注意到这里甚至有远程工作。我不打算使用页面刷新作为解决方法。先谢谢你

我为没有代码示例而道歉，我认为我的问题相当微不足道。就这样

文档1（index.php）Javascript

 <script>

$(document).ready(function() {

    ////////Home Functions
    $( "#issueSpinCoilBtn").click(function() {
         $.mobile.changePage( "#issueToSpin1", { transition : "slide"} );
    });
    $( "#issueRollBalanceBtn").click(function() {
         $.mobile.changePage( "#issueToRollBalance1", { transition : "slide"} );
    });

      /////////Issue To spin page 1 functions
   $( "#11InBtn").click(function() {
         $.mobile.changePage( "#issueToSpin2", { transition : "slide"} );
    });
    $( "#15InBtn").click(function() {
         $.mobile.changePage( "#issueToSpin2", { transition : "slide"} );
    });
    $( "#18InBtn").click(function() {
         $.mobile.changePage( "#issueToSpin2", { transition : "slide"} );
    })
    $( "#navRestartFromSpinPage1").click(function() {
         $.mobile.changePage( "#home", { transition : "slide"} );
         $("#selectionsForm")[0].reset();
    });



    $( "#findCoilBtn1").click(function() {

        $.mobile.changePage( "issueToSpinResults1.php?width="+ $('input[name=widthRadio]:checked').val() + "&gauge=" + $('input[name=gaugeRadio]:checked').val() + "&color=" + $("#selectColor").val(), { transition : "slide"} );

         $("#selectionsForm")[0].reset();

    });

});///END DOM READY

</script>

文档2（issueToSpinResults1.php）HTML

 $(document).ready(function() {
            $('#goBackToOptions').click(function() {
            $.mobile.changePage( "index.php#issueToSpin1", { transition : "slide"} ); 
        });
        $('#navRestart').click(function() {
            $.mobile.changePage( "index.php", { transition : "slide"} ); 
        });

         $('#printTagBtn').click(function() { 
        var datastring = "itemID=" + $('input[name=coilChoice]:checked').val() + "&weight=" +  $('#coil_weight').html();
        $.ajax({
            type: "POST",
            url: "doCreateSpinTag1.php",
            data: datastring,
            success: function(data) {

                $.mobile.changePage( "index.php", { transition : "slide"} );
            }
        }); 



        });



         $('#0').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '0' )
        });
        $('#1').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '1' )
        });
        $('#2').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '2' )
        });
        $('#3').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '3' )
        });
        $('#4').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '4' )
        });
        $('#5').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '5' )
        });
        $('#6').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '6' )
        });
        $('#7').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '7' )
        });
        $('#8').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '8' )
        });
        $('#9').click(function() { 
            $('#coil_weight').html( $('#coil_weight').html() + '9' )
        });
        $('#backspace').click(function() { 
            $('#coil_weight').html(
            function(index,value){
                 return value.substr(0,value.length-1);
            })
        });
        $('#clear').click(function() { 
            $('#coil_weight').html('');
        }); 
 });///END DOM READY

<body>

<div data-role="page" class="ui-body-a" id="spinresults1" name="spinresults1">

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

    <div role="main" class="ui-content" style="padding:50px;">
        <h1>Here is what we found:</h1>
   <div align="center">


     <?
     ///////////select all matching coil//////  


     if(mssql_num_rows($coilMatchesQuery) != 0){
         echo "<fieldset data-role=\"controlgroup\">
                <legend>Select Coil and Enter Weight to Create Tag:</legend>";
         $i = 1;
         while ($rowCoilMatches = mssql_fetch_array($coilMatchesQuery)) {
            echo "<input name=\"coilChoice\" id=\"coilChoice$i\" value=\"".trim($rowCoilMatches['ItemNo'])."\" type=\"radio\">
            <label for=\"coilChoice$i\">".trim($rowCoilMatches['ItemNo'])." - ".trim($rowCoilMatches['Description'])."</label>";     
            $i++;
        }
        echo "</fieldset>";
     }//End If
     else{
         echo "<h3>0 Coil Matches</h3>";
     }//End Else


 ?>

<div id="weight" align="center">

 <h2 align="center">Enter Weight</h2>
</div>

           <div align="center" style="font-size:36px; font-weight:bold;"><span id="coil_weight" style="font-size:36px; font-weight:bold;"></span>&nbsp;LBS</div>
               <br />

             <table align="center" border="0" cellspacing="5" cellpadding="5" width="400px">
  <tr>
    <td width="33%"><input id="7" type="button" value="7"></td>
    <td width="33%"><input id="8" type="button" value="8"></td>
    <td width="33%"><input id="9" type="button" value="9" ></td>
  </tr>
  <tr>
    <td width="33%"><input id="4" type="button" value="4" ></td>
    <td width="33%"><input id="5" type="button" value="5" ></td>
    <td width="33%"><input id="6" type="button" value="6" ></td>
  </tr>
  <tr>
    <td width="33%"><input id="1" type="button" value="1" ></td>
    <td width="33%"><input id="2" type="button" value="2" ></td>
    <td width="33%"><input id="3" type="button" value="3" ></td>
  </tr>
  <tr>
    <td width="33%"><input id="0" type="button" value="0"></td>
    <td width="33%"><input id="backspace" type="button" value="&larr;BKSP" ></td>
    <td width="33%"><input id="clear" type="button" value="CLEAR"></td>
  </tr>
    <tr>
  </tr>
</table> 


<div style="width:400px; margin-left:auto; margin-right:auto;"><a href="" data-iconpos="right" data-icon="arrow-r" data-role="button" id="printTagBtn">Print Coil Tag</a></div> 

    </div><!-- /content -->

    <div data-role="footer" style="overflow:hidden;" data-fullscreen="true" data-position="fixed">
    <div data-role="navbar">
        <ul>

            <li><a id="navRestart" name="navRestart" data-icon="refresh" data-transition="slide" >Start Over</a></li>
             <li><a id="goBackToOptions" name="goBackToOptions" data-icon="arrow-l" data-transition="slide" >Change Options</a></li>


        </ul>
    </div><!-- /navbar -->
</div><!-- /footer -->
</div><!-- /page -->


</body>


以下是我们的发现：
输入重量
磅



重新开始
更改选项

希望这能澄清一些事情。再次感谢大家。

首先，似乎<>代码> $.Mobile。由于信息有限，可能很难给你一个完整的答案。我假设您使用的是

$（“选择器”）。单击（…）

可定义单击事件

当changePage动态加载新内容时，新按钮不会绑定

onclick

事件

您的最佳选择是使用：

$(document).on("click", "selector", ...handler...);

也许如果你在问题中加一个，它会帮助人们帮助你。在我看来，你的代码没有正确设置。当您浏览现场页面时，它们会在Dom中四处传播。但是，如果你刷新一个页面或导航离开，这实际上是直接点击epage，而不是使用ajax。因此，您可能正在丢失脚本，或者根本没有人调用它。您需要查看这些函数以及它们链接到的任何页面事件。一些代码将帮助我们与您一起调试。谢谢，我添加了代码..pagecontainer.change（）使表单元素可见。。？？单击时文档没有成功…之前尝试过：（谢谢！我已更正…pagecontainer.change运行良好我没有指定正确的选择器。单击仍然没有成功：/Through！

$(document).on("click", "selector", ...handler...);