将document.write(screen.height)转换为coldfusion中的数字?

时间:2012-07-09 07:30:14

标签: javascript html coldfusion coldfusion-9

我使用以下代码来获取屏幕高度:

<CFSET rheight = "<script>document.write(screen.height);</script>">

rheight的价值是768,这是正确的。

但是当我这样做时: - :

<CFSET sheight = rheight / 4>

我收到以下错误:

值document.write(screen.height);无法转换为数字。

我们的想法是以数字格式获取屏幕高度,而无需重新加载页面。

1 个答案:

答案 0 :(得分:7)

有很多方法可以做到:

没有AJAX

不使用任何AJAX请求,您可以使用以下代码(仅在CF 9.0.2和CF10中测试)获得所需的结果:

<cfset rheight = "
    <script type='text/javascript' 
        src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'>
    </script>
    <script>
    $(document).ready(function() { 
        $('input.screenHeight').val(screen.height);
        alert($('input.screenHeight').val() / 4);
    })
    </script>">

<cfhtmlhead text="#rheight#" />

<input type="text" class="screenHeight" />

在这个例子中,我们创建了一个字符串变量,其中包含对jQuery库的引用以及用于获取屏幕高度的自定义代码。

我们将高度设置为文本输入框的值。然后我们可以提取该值并将其转换为数字。您可以在将值放入输入框之前转换该值,如下所示:

$('input.screenHeight').val(screen.height/4);

使用cfhtmlhead标记将字符串变量添加到文档的头部:

http://help.adobe.com/en_US/ColdFusion/9.0/CFMLRef/WSc3ff6d0ea77859461172e0811cbec22c24-7ae9.html

这仅适用于原始页面视图。如果您需要在页面更改或响应式设计布局更改后获取尺寸,则需要运行AJAX请求以恢复屏幕尺寸。

没有CFML

当然,您根本不需要使用ColdFusion。您可以从JavaScript中获得相同的数字转换:

<script type='text/javascript'     
    src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'>
</script>
<script type='text/javascript'>
    var getScreenHeight = function() {
        return screen.height;
    }

    $(document).ready(function() { 
    var screenheight = getScreenHeight();
    console.log(screenheight/4);
    })
</script>

但是,看起来你需要能够在ColdFusion中保持屏幕高度响应的值,如下所示:

使用AJAX和CFML

修改上面的JavaScript示例,我们可以创建一个AJAX请求,将屏幕高度值发布到新的.cfm页面:

<script type='text/javascript'>
var getScreenHeight = function() {
    return screen.height;
}

$(document).ready(function() { 
    var screenheight = getScreenHeight();

$.get("screensize.cfm",
    { screenheight: screenheight },
    function(data) {
        console.log('screen height has been set in the session scope: ' + data);
    }
)
})
</script>

最基本的是,screensize.cfm可能包含以下内容:

<cfsetting showdebugoutput="false" />
<cfparam name="URL.screenheight" type="numeric" default="800" />

<cfset session.screenheight = URL.screenheight />

<cfoutput>#session.screenheight#</cfoutput>

(这不包括您可能需要包含的任何验证或失败捕获)

假设您的应用程序启用了会话管理,这会将您发送的值放入SESSION范围,以便在整个应用程序中使用。

要记住的一件事是,在刷新之前,SESSION范围中的值将不可用于原始调用页面(发出AJAX请求的页面)。

我希望有所帮助。