如何在 jquery 中使用蛋糕元素？

Question

我正在使用 CakePHP 3，让我告诉你我想要做什么，是使用屏幕宽度条件在 div 中显示蛋糕元素，它会引发以下错误 Uncaught SyntaxError: Unexpected identifier。我已经告诉你，语法没有任何反应，没有逗号、句号等。我错过了。

我需要知道的是将元素助手放入jquery中的正确方法这个：<?= $ this->element('Search/Legislacion/form-search-legis') ?>

<script>
    $(document).ready(function(){
        var width = $(document).width(),
            search_form_legis = "<?= $this->element('Search/Legislacion/form-search-legis') ?>"; 

        // console.log(width);

        if(width >= 576){
            $('#searchDesktop').html(search_form_legis);
        }
    });
</script>

Answer 1

你不能只是将 HTML 转储到 JavaScript 字符串中，一旦出现第一个单引号/双引号，它就会破坏事物，因为这会关闭字符串，只需查看正在传递的页面的源代码，会有这样的：

search_form_legis = "<form method="POST" action="/url">...";

显然这是语法错误。

如果你想把来自PHP的数据放到JavaScript中，那么建议使用json_encode()，它会将数据转换成正确的格式。

var search_form_legis = <?= json_encode(
    $this->element('Search/Legislacion/form-search-legis')
) ?>;

一个字符串，如你的例子，将自动被引用和转义，即你甚至不需要在它周围加上引号，它看起来像这样：

var search_form_legis = "<form method=\"POST\" action=\"/url\">...";

话虽如此，如果根本没有完全不输出内容的充分理由，那么您可能需要考虑使用 CSS 规则来隐藏/显示它，类似于以下内容：

#searchDesktop {
    display: none;
}

@media (min-width: 576px) {
    #searchDesktop {
        display: block;
    }
}