Question

我无法获取document.ready事件或附加按钮点击事件。我在这里缺少什么？

这就是我的观点：

@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>

Answer 1

您没有正确宣布该文件

目前正是如此 $(document.ready(function(){

它需要

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

或

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

Answer 2

您的脚本中存在错误（错误的支撑和parens）。将其更改为：

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

错误控制台中会显示javascript错误，以显示此问题。

Answer 3

实际上，您甚至不需要文档就绪事件。只需在页面上的按钮存在后将绑定事件放在某处。这是通用的，无论您是否使用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>

Jquery Mobile document.ready未从视图中调用

3 个答案: