1

VisualStudioのjqueryモバイルテンプレートを使用しています。レイアウトビューには、次のマークアップがあります

   <div data-role="page"  @(Page.Id == null ? string.Empty : "id=" + Page.Id) data-fullscreen="false">

ブラウズビューがレンダリングされたら、データフルスクリーン属性をtrueに変更したいと思います。これを行うために私が使用しようとしているコードは次のとおりです。

<script type="text/javascript">
  $("#indexPage").live('pageinit', function () {
            alert("Code Engaged");
            $("#div").attr("data-fullscreen", "true");
        });
</script>

このコードを使用できません。コードをどこに配置してエンゲージしますか？レイアウトにはいくつかのセクションがあります。

<head>
  <meta charset="utf-8" />

  <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame 
       Remove this if you use the .htaccess -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

  <title>@Page.Title</title>
  <meta name="description" content="jQuery Mobile Site">
  <meta name="author" content="">

  <!--  Mobile viewport optimized: j.mp/bplateviewport -->
  @*<meta name="viewport" content="width=device-width, initial-scale=1.0">*@
  <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">


  <!-- jQuery Mobile Latest Styles -->
  <link rel="stylesheet" href="//code.jquery.com/mobile/latest/jquery.mobile.min.css" />

  @* // reference the minified version of our combined css based on whether we are in debug mode. *@
  @if (jQueryMobileTemplate.MvcApplication.IsDebug)
  { 
   @* <link rel="stylesheet" href="@Url.Content("~/css/style.css?v=2")" />*@
     <link rel="stylesheet" href="@Url.Content("~/css/custom%20themes/electric1.css?v=2")" /> 

  }
  else
  {
   @* <link rel="stylesheet" href="@Url.Content("~/css/style.min.css?v=2")" />*@
       <link rel="stylesheet" href="@Url.Content("~/css/custom%20themes/electric1.min.css?v=2")" />


  }

  <!-- Grab Google CDN's jQuery. fall back to local if necessary -->
  <!-- We put these at the top because jquery mobile applies styles before the page finishes loading -->
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js">


  </script>
  <script>      window.jQuery || document.write("<script src='@Url.Content("~/js/libs/jquery-1.6.1.min.js")'>\x3C/script>")</script>

  <!-- Pre jQuery Mobile init scripts for overriding defaults -->
  <script>

  </script>

  <!-- Load jQuery Mobile from jquery cdn, get latest builds -->
  <script src="//code.jquery.com/mobile/latest/jquery.mobile.min.js">

  </script>
  @* <!-- Optionally, load from local site -->
    <script src="@Url.Content("~/js/libs/jquery.mobile-1.0b1.js")"></script>
  *@

  @RenderSection("HeadContent", false)

  @*<script src="@Url.Content("~/js/libs/modernizr-2.0.min.js")"></script>
  <script src="@Url.Content("~/js/libs/respond.min.js")"></script>*@


</head>

「参照」ビューの下部でも試してみましたが、何もしませんでした。「参照」ビューでこのコードを実行したいだけです。

4

1 に答える 1

0

asp.net- mvcpageinitを使用している場合、何らかの理由でイベントが適切に機能しませんでした。代わりに、ページ変更イベント(pagebeforechangeまたは) のいずれかを使用してみてください。pagechange

于 2012-07-26T13:42:45.143 に答える