在移動MVC網站執行jquery

我使用的是來自visual studio的jquery mobile模板。在我版式視圖中，我有以下的標記在移動MVC網站執行jquery

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

當我瀏覽視圖顯示我想要的數據全屏attibute更改爲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>

我試過它在我的「瀏覽」視圖的底部以及但沒有。我只想「瀏覽」視圖來執行此代碼。

來源

2012-07-25 Nick LaMarca

你的DOM中是否有'id =「indexPage」'元素？如果Page.Id爲空，我發現你正在分配'string.Empty'。如果你沒有這樣的元素，'$（「＃indexPage」）'不會做太多事情。 – 2012-07-26 06:43:41

我正在使用mvc jqm手機模板。你是對的，有一個空字符串作爲頁面ID。頁面標識在佈局視圖中設置爲string.empty。如何將瀏覽視圖的id設置爲「indexPage」頁面是WebBasePage動態變量。我怎樣才能將它設置爲「indexPage」 – 2012-07-26 13:38:05

由於某種原因，當我使用asp.net-mvc時，pageinit事件從未正確地適用於我。您可以嘗試使用page change events（pagebeforechange或pagechange）之一。

來源

2012-07-26 13:42:45 Alejo

在移動MVC網站執行jquery

回答

相關問題