Блог

Главная - Вопросы по программированию - Jquery Mobile document.ready не вызывается из представления

Jquery Mobile document.ready не вызывается из представления

#jquery #asp.net-mvc-3 #jquery-mobile

#jquery #asp.net-mvc-3 #jquery-мобильный

Вопрос:

Я не могу получить событие document.ready или прикрепить событие нажатия кнопки. Чего мне здесь не хватает?

Вот как выглядит мой view:

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

    alert('Hello');

});

        $('#btnGo').bind('click', function () {
            alert('User clicked button');
        });

    </script>
}
<input type="text" id="txtStop" />
<input type="button" id="btnGo" value="Get Schedule" />

Вот как выглядит мой файл макета:

 <html>
<head>
    <link href="../../Content/themes/base/jquery.mobile-1.0b3.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/jquery-1.5.1.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery.mobile-1.0b3.js" type="text/javascript"></script>

</head>
@RenderSection("script")
<body>
    <div data-role="page">
        <div data-role="header">
        </div>
        <div data-role="content">@RenderBody()</div>
        <div data-role="footer">
            <h4>Page Footer</h4>
        </div>
    </div>
</body>
</html>

Ответ №1:

Вы неправильно объявляете document.ready

В настоящее время это $(document.ready(function(){

Это либо должно быть 

 $(function(){
    alert('Document is ready!');
     $('#btnGo').bind('click', function () {
        alert('User clicked button');
    });
});

или 

 $(document).ready(function(){ .... });

Ответ №2:

У вас есть ошибки в вашем скрипте (неправильная привязка и скобки). Измените его на это:

 <script language="javascript" type="text/javascript">
$(document).ready(function(){
    alert('Hello');
    $('#btnGo').bind('click', function () {
        alert('User clicked button');
    });
});
</script>

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

Ответ №3:

На самом деле, вам даже не нужно событие document ready. Просто поместите событие привязки где-нибудь после того, как кнопка появится на странице. Это универсально, независимо от того, используете вы jquery mobile или нет, вы можете привязать обработчик событий к объекту, как только он появится в DOM. В зависимости от того, сколько вы загружаете на страницу и сколько времени это занимает, это может быть более производительный способ выполнения задач.

 <head>
    ...
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
    ...
</head>
<body>
    ...
    <a href="#linkToWhatever" id="btnGo" data-role="button">click me</a>
    ...
    <script type="text/javascript">
        $('#btnGo').bind('click', function () {
            alert('User clicked button');
        });
    </script>
</body>