如何在 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\">...";

話雖如此，如果沒有充分的理由不 output 內容，那么您可能需要考慮使用 CSS 規則來隱藏/顯示它，類似於以下內容：

#searchDesktop {
    display: none;
}

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