无法从子视图引用JSF模板中的DOM元素
[英]Cannot reference a DOM element in the JSF template from child view
问题描述
I'm using JSF templates and Primefaces. 
我正在使用JSF模板和Primefaces。 I don't seem to be able to reference a specific div in the main page from a sub view. 我似乎无法从子视图引用主页中的特定div。
Template page template.xhtml: 模板页面template.xhtml：
<!DOCTYPE html>
<html lang="en"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:comp="http://java.sun.com/jsf/composite/components"
xmlns:pe="http://primefaces.org/ui/extensions">
<h:head>
<title><ui:insert name="title">Default title</ui:insert></title>
</h:head>
<h:body>
<div id="header">Header</div>
<div id="content"><ui:insert name="content">Default content</ui:insert></div>
<div id="footer">Footer</div>
</h:body>
</html>
client page page.xhtml 客户端页面page.xhtml
<ui:composition template="template.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:comp="http://java.sun.com/jsf/composite/components"
xmlns:pe="http://primefaces.org/ui/extensions">
<ui:define name="content">
<script type="text/javascript">
$(window).load(function() {
alert($('header').html());
});
</script>
<h1>New content here</h1>
<p>Stuff</p>
</ui:define>
</ui:composition>
The alert shows 'null'. 警报显示“空”。 I tried putting the script in different places inside the sub view but no luck. 我尝试将脚本放在子视图中的不同位置，但是没有运气。 Any idea what why its not visible? 知道为什么它不可见吗？ Thanks. 谢谢。
2 个解决方案
解决方案1
0 2013-02-18 18:36:49
I think you are trying to select element with "header" in it's ID, so you need to use this: 我认为您正在尝试选择ID为“ header”的元素，因此您需要使用以下代码：
$('#header')
If you wanted to select <header> element then you would use $('header') to select it. 如果要选择<header>元素，则可以使用$('header')进行选择。
解决方案2
0 2013-02-18 18:57:03
your original code had a separate header section, and then you also included a header section as a div in your body. 您的原始代码有一个单独的标头部分，然后您在体内还包含了一个标头部分作为div。 the header html tag was removed and the ui tag moved to your div. 标头html标签已删除，ui标签已移至div。
<!DOCTYPE html>
<html lang="en"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:comp="http://java.sun.com/jsf/composite/components"
xmlns:pe="http://primefaces.org/ui/extensions">
<h:body>
<div id="header"><ui:insert name="title">Default Title</ui:insert></div>
<div id="content"><ui:insert name="content">Default Content</ui:insert></div>
<div id="footer">Footer</div>
</h:body>
</html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.