在我的 jsf 应用程序中将">"和"<"转换为 javascript 中的 "<" 和">"的奇怪问题



我有一些javascript,我试图在jsf应用程序中使用。我已经缩小了范围,以便如果我拿出下面的行,事情工作得很好,但是当我有这些行,我得到一个错误在chrome控制台说"意外",它显示第一行为if(maxdays &gt; 1000) {

为什么将大于符号转换为&gt; ?

if(maxdays > 1000) {
    maxdays = 1000;
}

编辑:这是整个JSF页面。

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:rich="http://richfaces.org/rich">

<h:head>

    <title>Protocol Dashboard</title>
    <link type="text/css" rel="stylesheet" href="../css/styles.css" />
    <script type="text/javascript" src="../js/jquery-1.5.2.js"></script>
    <script type="text/javascript" src="../js/highcharts.src.js"></script>
    <script type="text/javascript">
        $(document).ready(
                function() {
                    //var chartData;
                    //var goodData;
                    var chart;
                    var studyType;
                    var categories;
                    var maxdays;
                    //var chart = new Highcharts.Chart({
                    var options = {
                        chart : {
                            renderTo : 'container',
                            type : 'bar'
                        },
                        title : {
                            text : 'Gantt module development plan'
                        },
                        subtitle: {
                            text: studyType
                        },
                        xAxis : {
                            categories : [ 'Planning', 'Development',
                                    'Testing', 'Documentation' ]
                        },
                        yAxis : {
                            type : 'datetime',
                            min : Date.UTC(2012, 0, 1),
                            labels : {
                                formatter : function() {
                                    return Highcharts.dateFormat('%m/%d/%Y',
                                            this.value);
                                }
                            }
                        },
                        tooltip : {
                            formatter : function() {
                                var point = this.point;
                                return '<b>'
                                        + point.category
                                        + '</b><br/>'
                                        + Highcharts.dateFormat('%b %e, %Y',
                                                point.low)
                                        + ' - '
                                        + Highcharts.dateFormat('%b %e, %Y',
                                                point.y);
                            }
                        },
                        series : [ {
                            data : [ {
                                low : Date.UTC(2012, 0, 1),
                                y : Date.UTC(2012, 0, 15)
                            }, {
                                low : Date.UTC(2012, 0, 10),
                                y : Date.UTC(2012, 4, 28)
                            }, {
                                low : Date.UTC(2012, 3, 15),
                                y : Date.UTC(2012, 4, 28)
                            }, {
                                low : Date.UTC(2012, 4, 15),
                                y : Date.UTC(2012, 4, 28)
                            } ]
                        }, {
                            data : [ {
                                low : Date.UTC(2012, 0, 1),
                                y : Date.UTC(2012, 1, 15)
                            }, {
                                low : Date.UTC(2012, 0, 10),
                                y : Date.UTC(2012, 3, 15)
                            }, {
                                low : Date.UTC(2012, 3, 15),
                                y : Date.UTC(2012, 6, 14)
                            }, {
                                low : Date.UTC(2012, 4, 15),
                                y : Date.UTC(2012, 4, 25)
                            } ]
                        } ]
                    };
                    function loadData() {
                        //options.series.length = 0;
                        //options.xAxis.categories.length = 0;
                        $('#hiddenData').val('09-034,99|10-053,194');
                        $('#hiddenCategories').val('09-034|10-053');
                        $('#clickedMenu').val('P2C');
                        $('#hiddenMaxDays').val('194');

                        var chartData = $('#hiddenData').val();
                        console.log('hiddenData = '+chartData);
                        categories = $('#hiddenCategories').val();
                        console.log('hiddenCategories = '+categories);
                        studyType = $('#clickedMenu').val();
                        console.log('clickedMenu = '+studyType);
                        maxdays = $('#hiddenMaxDays').val();
                        console.log('hiddenMaxDays = '+maxdays);
                        console.log('maxdays = '+maxdays);

                        //options.yAxis.max = maxdays;
                        options.subtitle.text = studyType;
                        var goodData = chartData.split('|');
                        //console.log('goodData = '+goodData);
                        //var goodCategories = categories.split(",");
                        //console.log('goodCategories = '+goodCategories);
                        /*
                        var series = {
                            data : []
                        };
                        var cat = {
                            categories : []
                        };
                        try {
                            $.each(goodData, function(index, value) {
                                var goodData2 = value.split(",");
                                //series.name = goodData2[0];
                                series.data.push(parseFloat(goodData2[1]));
                            });
                            $.each(goodCategories, function(index, value) {
                                var prot = value;
                                options.xAxis.categories.push(value);
                            });
                            options.series.push(series);
                            //console.log(options);
                        } catch (err) {
                            //console.log("ERROR ..." + err.description + '  message:'
                            //+ err.message);
                        }*/
                    }
                    function loadDataAndCreateChart() {
                        loadData();
                        //console.log(options);
                        chart = new Highcharts.Chart(options);
                    }
                    loadDataAndCreateChart();
                });
    </script>
</h:head>
<h:body>
    <div id="container"></div>
    <h:inputHidden value="#{selectCategory.jsonResults }" id="hiddenData" />
    <h:inputHidden value="#{selectCategory.jsonResultsCategories }" id="hiddenCategories" />
    <h:inputHidden value="#{selectCategory.menuItem}" id="clickedMenu" />
    <h:inputHidden value="#{selectCategory.maxDays}" id="hiddenMaxDays" />
</h:body>
</html>

您正在使用Facelets,这是一种基于XML的视图技术。JavaScript操作符如>, &等是XML中的特殊字符,在XML文件中用于其他目的时是非法的。Facelets就是这样处理它们的。

我强烈建议把所有的JS代码放在自己的.js文件中,并通过<script src><h:outputScript>引用它。

<script src="#{request.contextPath}/js/global.js"></script>

<h:outputScript name="js/global.js" />

另一个好处是,你可以通过这种方式微调浏览器缓存,最终得到一个更有效的网站。


与具体问题无关:请注意我是如何引用库的。您应该选择域相对路径而不是uri相对路径。使用../是一种维护痛苦。如果您移动视图或更改请求URI,它将中断。

&gt;是必须用于在HTML中输出>字符的HTML实体。<>是HTML标记使用的特殊字符,如果必须在页面中显示这些字符,则必须将其转义为&lt;&gt;。我怀疑您使用的是转义其输入的JSF标记。

我没有太多的JSF经验,但是您可以尝试将脚本包含在CDATA部分中:

<script type="text/javascript">
<![CDATA[
   your JavaScript code here
]]>
</script>

但是最好的解决方案是在HTML中根本没有JavaScript,并且从外部文件加载它。

相关内容

  • 没有找到相关文章