jQuery 没有在 Yii 2 上运行答案

【问题标题】：jQuery is not running on Yii 2jQuery 没有在 Yii 2 上运行
【发布时间】：2016-10-05 11:31:17
【问题描述】：

我从网上复制一个代码来制作一个对话框弹出表单。代码是：

   <!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI Dialog functionality</title>
    <link href="https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <!-- CSS -->
    <style>
        .ui-widget-header,.ui-state-default, ui-button{
            background:#b9cd6d;
            border: 1px solid #b9cd6d;
            color: #FFFFFF;
            font-weight: bold;
        }
    </style>
    <!-- Javascript -->
    <script>
        $(function() {
            $( "#dialog-1" ).dialog({
                autoOpen: false,
            });
            $( "#opener" ).click(function() {
                $( "#dialog-1" ).dialog( "open" );
            });
        });
    </script>
</head>
<body>
<!-- HTML -->
<div id="dialog-1" title="Dialog Title goes here...">This my first jQuery UI Dialog!</div>
<button id="opener">Open Dialog</button>
</body>
</html>

我在 Yii 2 中创建了一个视图并将此代码复制到那里但输出没有运行，输出只是一个按钮和普通按钮和 paragraf 一样的 paragraf 并且没有 popuo 和对话框 !!1 我该怎么办？

【问题讨论】：

确保没有任何控制台错误
@madalinivascu 我没有更改代码，我只是 Crt C + Crt V :))）代码在我阅读的教程网站上运行良好。
您可以尝试在视图文件中仅添加 BODY 部分，因为其他部分将来自布局部分。如果您只想测试该对话框是否正常工作，请在视图文件中包含代码中提到的 js 和 css。

标签： php jquery yii yii2 yii2-basic-app

【解决方案1】：

视图在布局内呈现你在 app/views/layout 中找到布局

您是否将完整的 quellcode 复制到视图中？比你的布局中可能还有一些 javascript 加载标签

查看浏览器中的 quellcode 进行检查

尝试将此部分放入布局中

如果

<link href="https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <!-- CSS -->
    <style>
        .ui-widget-header,.ui-state-default, ui-button{
            background:#b9cd6d;
            border: 1px solid #b9cd6d;
            color: #FFFFFF;
            font-weight: bold;
        }
    </style>
    <!-- Javascript -->
    <script>
        $(function() {
            $( "#dialog-1" ).dialog({
                autoOpen: false,
            });
            $( "#opener" ).click(function() {
                $( "#dialog-1" ).dialog( "open" );
            });
        });
    </script>

这部分进入你的视野

<!-- HTML -->
<div id="dialog-1" title="Dialog Title goes here...">This my first jQuery UI Dialog!</div>
<button id="opener">Open Dialog</button>

如果您有 chrome 或 firefox 浏览器，请按 control+shift+i 并检查 quellcode 如果这仍然是正确的 html

或者也许你有一棵这样的树

<html>
<head>
 ......
</head>

<body>


    <html>
    <head>
     ......
    </head>

    <body>
     ......
    </body>

    </html>


</body>

</html>

【讨论】：

我认为我的布局中有一些js加载标签，有问题吗？那么我应该从我的 yii 2 中禁用或删除默认的 js 吗？ @ThomasRohde
如果您在没有必要更改的情况下尝试示例源，它将无法正常工作。将示例中的 javascript 加载添加到您的布局中，并删除示例中的标题和正文标签 ..
很抱歉，没听懂！如果你的意思是我把这段代码复制到一个空的 html 文件中，我又做了一次，它运行良好！！！ @ThomasRohde
我检查 quellcode ，当页面运行时我可以在代码中看到我的 quellcode ！ @ThomasRohde
好的，请将完整生成的运行html quellcode复制到您的问题中，而不是示例中