Как избежать нескольких $ (документ) .ready () - PullRequest
Новая
       26

Как избежать нескольких $ (документ) .ready ()

2 голосов
/ 24 июня 2011

Я работаю над приложением ASP.NET, используя Jquery.Jquery действительно мощный, и я использую его много.На своей главной странице я включаю все библиотеки, которые я использую, и файл js, который содержит код jquery, доступный для всех приложений (взаимодействие с интерфейсом).В этом js-файле (Main.js) я делаю некоторые вещи, поэтому я использую $(document).ready( ... etc .. )

Но на некоторых страницах, которые являются более сложными, мне нужно использовать какой-то другой код jquery .. Поэтому я добавляю немного головыСодержимое с другим тегом скрипта. И в этом проблема, я должен снова добавить инструкцию $(document).ready().

Существует много проблем с моими средствами управления asp с этим способом, элементы управления автостопом не делаютне выполняет их автоответчик .. Я думаю, что это проблема с множественным объявлением $(document).ready(), потому что, когда я удаляю второе (на странице, не находящейся на главной странице), элементы управления работают.

Так как можноЯ делаю, чтобы добавить код JavaScript на определенной странице без нескольких $(document).ready() деклараций.(Я не хочу вставлять весь код jquery на всех страницах.)

Надеюсь, я достаточно ясен, спасибо за ответы

Отредактируйте здесь код

Часть главной страницы 

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="SiteMaster" %>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">


<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
    <link href="Styles/jquery-ui-1.8.9.custom.css" rel="stylesheet" type="text/css" />
    <link href="Styles/menu.css" rel="stylesheet" type="text/css" />

    <script src="/js/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script src="/js/jquery-ui-1.8.7.custom.min.js" type="text/javascript"></script>
    <script src="/js/jquery.cookie.js" type="text/javascript"></script>
    <script src="/js/jquery.ui.datepicker-fr.js" type="text/javascript"></script>
    <script src="/js/jquery.color.js" type="text/javascript"></script>  
    <script src="/js/Menu.js" type="text/javascript"></script>
    <script src="/js/iphone-style-checkboxes.js" type="text/javascript"></script>  
    <script src="/js/jquery.tools.min.js" type="text/javascript"></script>      
    <script src="/js/Main.js" type="text/javascript"></script>                   

    <asp:ContentPlaceHolder ID="HeadContent" runat="server">
    </asp:ContentPlaceHolder>
</head>

<body>
Some content....

</body>
</html>

Main.js 

$(document).ready(function () {

/// <reference path="jquery-1.4.4-vsdoc.js" />

//There is a lot of content here......

});

и страница 

<%@ Page MasterPageFile="~/Site.master" Language="C#" AutoEventWireup="true" CodeBehind="Dep.aspx.cs" Inherits="Dep" %>

<asp:Content ID="HeadContent1" ContentPlaceHolderID="HeadContent" runat="server">
<link href="../../Styles/nyroModal.css" rel="stylesheet" type="text/css" />
<script src="../../js/jquery.nyroModal.custom.min.js" type="text/javascript"></script>

<script type="text/javascript">    
    $(document).ready(function () {

        $('#tbxDateDebut').datepicker();
        $('#tbxDateFin').datepicker();

        $('.nyroModal').nyroModal();
    });

</script>


</asp:Content>


<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

//Here comes the controls... (lot of code)       


</asp:Content>

Ответы [ 4 ]

6 голосов
/ 24 июня 2011

main.js 

$(document).ready(function () {
  //There is a lot of content here......
  if ($.pageReady) $.pageReady($);
});

page.js 

<script type="text/javascript">

  $.pageReady = function() {
    // fired on DOM ready
  }

</script>
1 голос
/ 24 июня 2011

Ответ на ваш вопрос:

Но на некоторых более сложных страницах мне нужно использовать какой-то другой код jquery. Поэтому я добавляю некоторый заголовок Content с другим тегом сценария. И в этом проблема, я должен добавить $ (document) .ready () инструкция снова.

"Но на некоторых страницах ..."

К сожалению, вы должны добавить ссылку на каждый файл js, который ссылается на необычные элементы. То есть, если у вас есть страница 1 с <div id="element1"> и другая страница (страница 2) с <div id="element676">, вы не захотите включать все в обработку Jquery в Main.js. На самом деле это выдает ошибку, если вы еще не видели страницу 2.

Черт возьми, ребята, вы быстры ... когда я писал, @Raynos дал правильный ответ.

0 голосов
/ 24 июня 2011

Я склонен думать, что здесь есть что-то другое, кроме ваших $(document).ready() вызовов. AFAIK, множественные вызовы на $(document).ready() (и даже всплывающие версии, такие как $('#someid').ready()) не должны вызывать проблем, поскольку все они незаметно агрегируются для вас jQuery.

Я бы дважды проверил мой синтаксис для начала и убедился, что все ваши блоки правильно инкапсулированы, все операторы заканчиваются ; и всем этим джазом.

0 голосов
/ 24 июня 2011

хорошо, альтернатива - переместить все готовые документы jquery в конец вашей страницы. 

<body>
... here goes your other html ....

<script>

//$(document).ready(function(){//this is not needed
   ... here goes the first ready...
//});//this is not needed
//$(document).ready(function(){//this is not needed
   ... here goes the second ready ... and so on...
//});//this is not needed
</script>

</body>

Таким образом, вы фактически используете document.ready, когда все остальные элементы готовы :) PS

...