2008-11-23 4 views
6

Начало работы с jquery и возникновение проблем с получением приветствия типа типа world для asp.net mvc. При попытке загрузить страницу с этим скриптом я получаю ошибку «время ожидания» во время выполнения.Где должен быть размещен блок сценария с кодом jquery на главной странице ASP.NET MVC?

A. Где должны быть размещены теги сценариев на главной странице? B. Что я могу делать неправильно? На моей странице есть определенные элементы?

<script src="../Scripts/jquery-1.2.6.min.js" type="text/javascript"></script> 

      <script src="../Scripts/jquery.corner.js" type="text/javascript"></script> 

      <script type="text/javascript"> 
       $(document).ready(function() { 
        $("a").click(function(event) { 
         alert("Thanks for visiting!"); 
        }); 
       }); 
      </script> 

ответ

1

B) Я проверил свой встроенный скрипт на быстрой тестовой странице, и это хорошо работает, так что я совет с помощью Firefox с FireBug плагин для поиска проблемы:

  • На вкладке Firebug, «сценарий» используйте окно «Смотреть» справа, чтобы вставить и проверить части своего сценария и посмотреть, что они вернут.
  • Я хотел бы начать с проставлением $ в окне просмотра и проверки, если он признан function(): возможно JQuery не связан propertly
  • Затем положить $("a") в окне просмотра и проверьте, если набор возвращается имеет правильное число элементов соответствующего к «» селектор в наборе
  • Keep ходовых частей скрипта, пока вы не столкнетесь что-то неправильно
11

Хммм ...

Чтобы ответить на ваш первый вопрос: они должны быть помещены в <head> элемент.

Также, как правило, я использую 'bind' method во время погружающихся событий в DOM (как будто это похоже на то, что вы пытаетесь сделать).

Таким образом, код будет выглядеть следующим образом:

$(document).ready(function() 
{ 
    // Bind each link to a handler: 
    $("a").bind('click dblclick', function(event) 
    { 
     alert('click'); 
    }) 
}); 

Кроме того, несколько дизайнерских советов (так как вы работаете с чем-то близко к моему сердцу (ASP.NET MVC с JQuery):

Add дополнительный «ContentPlaceHolder» в нижней части элемента вашей главной страницы <head>. Это позволит вам работать с определенным javascript в определенном месте: в разделе «head» на странице, и это позволит вам делать страницы, в частности, javascript.

Это будет выглядеть примерно так:

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

Почему это полезно? Скажу вам: этот плагин jQuery rounded corner, который вы используете, может использоваться только на нескольких страницах - зачем включать его на каждую страницу?

2

Я согласен с Дэном, чтобы добавить контент-заполнитель для связывания в скриптах. Тем не менее, голова, как правило, не лучшее место для размещения вашего JavaScript с точки зрения производительности. Лучшее место в нижней части страницы. Таким образом, ваш HTML может загружаться до вашего JavaScript. См. Yahoo's YSlow tip. Ваш код все равно должен работать в разделе главы.

Я хотел бы разместить большую часть JavaScript своего сайта в одном файле и связать его со всеми страницами. Если он становится очень большим, вы можете разделить его на несколько файлов. Это использует кеширование браузера.

Что не так с кодом jQuery. Я не уверен. Это выглядит довольно корректно. Единственное, что мне интересно, это параметр события. Попытайтесь полностью вытащить это. Я знаю, что функции разрешен параметр, но я обычно использую «это» вместо этого. Также попробуйте переименовать параметр.

+0

Хорошего вызов на кончике YSlow , Я не понял, что скрипты блокируют параллельную загрузку. – 2008-11-23 16:13:37

1

мастер страницы обычно хранятся в /Views/Shared/Site.Master в то время как сценарии находятся в/Scripts так эти:

<script src="../Scripts/jquery-1.2.6.min.js" type="text/javascript"></script>    
<script src="../Scripts/jquery.corner.js" type="text/javascript"></script> 

должен быть

<script src="../../Scripts/jquery-1.2.6.min.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.corner.js" type="text/javascript"></script> 

, но я предложил бы использовать помощник:

public static class Helper 
    { 
     private static string ScriptsRoot = "~/scripts/"; 

     public static string ScriptUrl (string scriptFile) 
     { 
      return VirtualPathUtility.ToAbsolute (ScriptsRoot + scriptFile); 
     } 
    } 

А потом ссылку скрипта так:

<script type="text/javascript" src="<%= Helper.ScriptUrl("jquery-1.2.6.min.js") %>"></script> 
<script type="text/javascript" src="<%= Helper.ScriptUrl("jquery.corner.js") %>"></script> 
Смежные вопросы