Question

我正在制作一个响应式网站，我希望能够使用javascript来获取屏幕大小，然后根据屏幕大小渲染一个coldfusion。像这样：

if (screen.width <= 700) {
     <cfinclude template="file1.cfm">
} else {
     <cfinclude template="file.cfm">
}

我也尝试通过.ajax（）加载，但是当我在cfm文件中包含已经包含的文件时，我会陷入困境。

Answer 1

JavaScript是客户端。 ColdFusion是服务器端。如果你想混合两者，你需要Ajax。你应该尝试更多像使用jQuery轻松实现Ajax：

// LOOK AT THE SCREEN WIDTH
if (screen.width <= 700) {
     // LOAD THE PAGE INTO THE CORRECT SIZED DIV
     $("#YourDiv").load("ColFusionFile-01.cfm");
} else {
     // LOAD THE PAGE INTO THE CORRECT SIZED DIV
     $("#YourDiv").load("ColFusionFile-02.cfm");
}

或者，您可能想要重定向它们：

// LOOK AT THE SCREEN WIDTH
if (screen.width <= 700) {
     // SEND THE VISITOR TO THE CORRECT SIZED PAGE
     window.location.href = "ColFusionFile-01.cfm"
} else {
     // SEND THE VISITOR TO THE CORRECT SIZED PAGE
     window.location.href = "ColFusionFile-02.cfm"
}

Answer 2

您应该根据屏幕大小使用CSS媒体查询和样式表进行不同的显示渲染。这将允许您为两个显示器都有一个CF页面。不需要AJAX。

媒体查询的W3C文档：http://www.w3.org/TR/css3-mediaqueries/

关于“响应式网页设计”的精彩文章： http://www.alistapart.com/articles/responsive-web-design/

以下是使用此技术的网站的一些很棒的示例：http://mediaqueri.es/

Answer 3

你想做的事是不可能的。 JavaScript是一种客户端语言，ColdFusion是一种服务器端语言。您无法在JavaScript块中执行cfinclude，因为该代码将在浏览器中执行，而不是在服务器上执行。

屏幕尺寸检测后冷敷

3 个答案: