Fatal编程技术网
  • javascript/
  • 刷新后，Javascript才会在jQuery Mobile上运行

刷新后，Javascript才会在jQuery Mobile上运行

javascript ajax ruby-on-rails-3 jquery jquery-mobile

刷新后，Javascript才会在jQuery Mobile上运行,javascript,ajax,ruby-on-rails-3,jquery,jquery-mobile,Javascript,Ajax,Ruby On Rails 3,Jquery,Jquery Mobile,我知道这里已经有多个线程在讨论这个问题，但是到目前为止，没有一个建议能让我找到解决方案。因此，我将发布我自己的。基本上，我有一个javascript函数，设置为在我的一个页面上运行。在刷新页面之前，它不会工作。我的理解是，这个问题与ajax加载页面的方式有关 我尝试过的事情： 将脚本代码添加到用户首先看到的首页布局中 当这不起作用时，将脚本代码添加到站点使用的所有3个布局中 将脚本添加到此特定布局的主体 代码如下。提前感谢您的帮助 这是布局的代码： <!DOCTYPE html>

我知道这里已经有多个线程在讨论这个问题，但是到目前为止，没有一个建议能让我找到解决方案。因此，我将发布我自己的。基本上，我有一个javascript函数，设置为在我的一个页面上运行。在刷新页面之前，它不会工作。我的理解是，这个问题与ajax加载页面的方式有关

我尝试过的事情：

  • 将脚本代码添加到用户首先看到的首页布局中
  • 当这不起作用时，将脚本代码添加到站点使用的所有3个布局中
  • 将脚本添加到此特定布局的主体
代码如下。提前感谢您的帮助

这是布局的代码：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <title>RENT</title>
  <%= stylesheet_link_tag    "application", :media => "all" %>
  <%= javascript_include_tag :application %>
  <%= csrf_meta_tags %>
  <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
  <%= stylesheet_link_tag "my.css" %>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script src="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
  <%= javascript_include_tag "my.js" %>
        <script src="/assets/jquery.maskMoney.js" type="text/javascript"></script>

  <!-- THIS IS THE FUNCTION I NEED HELP WITH! -->
  <script type="text/javascript">
    $(function(){
        $("#paymentAmount").maskMoney({symbol:'$ '});
    })
    </script>
</head>
<body>

    <div data-role="page" data-theme="b" id="page4">
          <div data-theme="b" data-role="header">
              <a data-role="button" data-theme="b" href="/home"
               data-icon="back" data-iconpos="left" class="ui-btn-left">
                  Back
              </a>
              <a id="settings" data-role="button" data-inline="true" data-theme="b"
               href="#page9" data-icon="gear" data-iconpos="notext" class="ui-btn-right">
              </a>
              <h3>
                  Pay Rent
              </h3>
          </div>

        <%= content_tag(:div, flash[:error], :id => "flash_error") if flash[:error] %>
        <%= content_tag(:div, flash[:notice], :id => "flash_notice") if flash[:notice] %>
        <%= content_tag(:div, flash[:alert], :id => "flash_alert") if flash[:alert] %>

        <%= yield %>

        <div data-theme="a" data-role="footer" data-position="fixed">
              <h1>
                  © 2013
              </h1>
          </div>
      </div>

</body>
</html>

<!-- Pay Rent (R) -->
  <div data-role="content" style="padding: 10px">
    <%= form_for(@rentPayment, :url => { action: "create" }) do |f| %>z
      <div data-role="fieldcontain">
        <fieldset data-role="controlgroup" data-mini="true">
        <label for="paymentAmount"> Payment Amount </label>
        <input name="rentPayment[paymentAmount]" id="paymentAmount" placeholder="$ 0.00" value="" type="text">
        </fieldset>
      </div>
      <div data-role="fieldcontain">
        <fieldset data-role="controlgroup" data-mini="true">
        <label for="paymentDate"> Pay on this date </label>
        <input name="rentPayment[paymentDate]" id="paymentDate" placeholder="" value="" type="date">
        </fieldset>
      </div>
      <input type="submit" data-theme="b" value="Submit Payment" data-mini="true">
    <% end %>
  </div>


租
“全部”%>
$（函数（）{
$（“#paymentAmount”）.maskMoney（{symbol:'$'）；
})
付房租
如果闪烁[：错误]]>
“闪光通知”）如果闪光[：通知]]>
如果闪烁[：警报]]>
© 2013
这是控制器的代码：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <title>RENT</title>
  <%= stylesheet_link_tag    "application", :media => "all" %>
  <%= javascript_include_tag :application %>
  <%= csrf_meta_tags %>
  <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
  <%= stylesheet_link_tag "my.css" %>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script src="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
  <%= javascript_include_tag "my.js" %>
        <script src="/assets/jquery.maskMoney.js" type="text/javascript"></script>

  <!-- THIS IS THE FUNCTION I NEED HELP WITH! -->
  <script type="text/javascript">
    $(function(){
        $("#paymentAmount").maskMoney({symbol:'$ '});
    })
    </script>
</head>
<body>

    <div data-role="page" data-theme="b" id="page4">
          <div data-theme="b" data-role="header">
              <a data-role="button" data-theme="b" href="/home"
               data-icon="back" data-iconpos="left" class="ui-btn-left">
                  Back
              </a>
              <a id="settings" data-role="button" data-inline="true" data-theme="b"
               href="#page9" data-icon="gear" data-iconpos="notext" class="ui-btn-right">
              </a>
              <h3>
                  Pay Rent
              </h3>
          </div>

        <%= content_tag(:div, flash[:error], :id => "flash_error") if flash[:error] %>
        <%= content_tag(:div, flash[:notice], :id => "flash_notice") if flash[:notice] %>
        <%= content_tag(:div, flash[:alert], :id => "flash_alert") if flash[:alert] %>

        <%= yield %>

        <div data-theme="a" data-role="footer" data-position="fixed">
              <h1>
                  © 2013
              </h1>
          </div>
      </div>

</body>
</html>

<!-- Pay Rent (R) -->
  <div data-role="content" style="padding: 10px">
    <%= form_for(@rentPayment, :url => { action: "create" }) do |f| %>z
      <div data-role="fieldcontain">
        <fieldset data-role="controlgroup" data-mini="true">
        <label for="paymentAmount"> Payment Amount </label>
        <input name="rentPayment[paymentAmount]" id="paymentAmount" placeholder="$ 0.00" value="" type="text">
        </fieldset>
      </div>
      <div data-role="fieldcontain">
        <fieldset data-role="controlgroup" data-mini="true">
        <label for="paymentDate"> Pay on this date </label>
        <input name="rentPayment[paymentDate]" id="paymentDate" placeholder="" value="" type="date">
        </fieldset>
      </div>
      <input type="submit" data-theme="b" value="Submit Payment" data-mini="true">
    <% end %>
  </div>


{操作：“创建”}）do | f |%>z
付款金额
在这个日期付款
编辑的布局页面

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <title>RENT</title>
  <%= stylesheet_link_tag    "application", :media => "all" %>
  <%= javascript_include_tag :application %>
  <%= csrf_meta_tags %>
  <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
  <%= stylesheet_link_tag "my.css" %>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script src="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
  <%= javascript_include_tag "my.js" %>
        <script src="/assets/jquery.maskMoney.js" type="text/javascript"></script>

  <!-- THIS IS THE FUNCTION I NEED HELP WITH! -->
 <script type="text/javascript">
    $(document).on('pageshow', '#page4', function () { $("#paymentAmount").maskMoney({symbol:'$ '}); });
    <!--$(document).ready(function(){$("#paymentAmount").maskMoney({symbol:'$ '});})-->
  </script>
</head>
<body>

    <div data-role="page" data-theme="b" id="page4">
          <div data-theme="b" data-role="header">
              <a data-role="button" data-theme="b" href="/home"
               data-icon="back" data-iconpos="left" class="ui-btn-left">
                  Back
              </a>
              <a id="settings" data-role="button" data-inline="true" data-theme="b"
               href="#page9" data-icon="gear" data-iconpos="notext" class="ui-btn-right">
              </a>
              <h3>
                  Pay Rent
              </h3>
          </div>

        <%= content_tag(:div, flash[:error], :id => "flash_error") if flash[:error] %>
        <%= content_tag(:div, flash[:notice], :id => "flash_notice") if flash[:notice] %>
        <%= content_tag(:div, flash[:alert], :id => "flash_alert") if flash[:alert] %>

        <%= yield %>

        <div data-theme="a" data-role="footer" data-position="fixed">
              <h1>
                  © 2013
              </h1>
          </div>
      </div>

</body>
</html>


租
“全部”%>
$（document）.on（'pageshow'，'#page4'，function（）{$（“#paymentAmount”）.maskMoney（{symbol:'$'）；}）；
付房租
如果闪烁[：错误]]>
“闪光通知”）如果闪光[：通知]]>
如果闪烁[：警报]]>
© 2013
您是否尝试过
$（document）.ready（function（）{…}）？尝试
$（文档）.on（'pageshow'，'#pageID'，函数（）{$（“#paymentAmount”）.maskMoney（{symbol:'$'）；}）@Omar我把这个放在哪一页？此特定页面的布局或主页的布局或两者兼而有之？对于特定页面。@Omar它不起作用。