Paw*_*wan 4 jquery liferay liferay-6
我正在使用Liferay 6作为应用程序.我想使用Jquery作为用户界面部件而不是默认的Alloy.为此,我通过这种方式编辑liferay-portlet.xml,将JQuery与Liferay集成在一起
<portlet>
<portlet-name>First</portlet-name>
<icon>/icon.png</icon>
<instanceable>true</instanceable>
<header-portlet-css>/css/main.css</header-portlet-css>
<header-portlet-javascript>https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js</header-portlet-javascript>
<header-portlet-javascript>https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.15/jquery-ui.min.js</header-portlet-javascript>
<footer-portlet-javascript>/js/main.js</footer-portlet-javascript>
<css-class-wrapper>First-portlet</css-class-wrapper>
</portlet>
这是我的view.jsp
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<portlet:defineObjects />
This is the <b>Sai Nath</b> portlet.
现在请告诉我如何将以下Jquery Hello World Alert放在view.jsp中
这是我的Jquery Hello World警报程序
<html>
<head>
<title>jQuery Hello World Alert box</title>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
</head>
<script type="text/javascript">
$(document).ready(function(){
$("#cl").click(function(){
alert("HELLO WORLD!");
});
});
</script>
<body>
<font color="red">CLICK BELOW BUTTON TO SEE ALERT BOX</font>
<br>
<br>
<button id="cl">Click Me</button>
</body>
</html>
请让我知道,谢谢你的阅读.
Ola*_*ock 11
首先:你的portlet的jsp永远不应该包含<html>,<head>或者<body>.这些部分是门户网站的业务.
此外,即使您已经要求Liferay将其包含在head部分(如您所声明的那样),您也会在页面中再次包含jquery.
如果省略这个,它就像你上面写的一样 - 我已经测试过了.这是我的jsp:
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<portlet:defineObjects />
<script type="text/javascript">
$(document).ready(function(){
$("#cl").click(function(){
alert("HELLO WORLD!");
});
});
</script>
<font color="red">CLICK BELOW BUTTON TO SEE ALERT BOX</font>
<br>
<br>
<button id="cl">Click Me</button>
一个完全不同的选项使用AlloyUI(或YUI)的能力来动态加载jQuery作为AlloyUI模块.liferay-portal.xml中不需要声明.您甚至可以在一个页面中加载不同版本的jquery.jsp看起来像这样:
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<portlet:defineObjects />
AUI/jQuery
<script>
AUI().use('gallery-yquery', function(A) {
var jq = A.YQuery();
jq.version = '1.6.2';
jq.use( function() {
alert( 'jquery ' + $.fn.jquery + ' loaded' ); // Will show that 1.6.2 loaded successfully
$(document).ready(function(){
$("#cl").click(function(){
alert("HELLO WORLD!");
});
});
});
});
</script>
| 归档时间： |
|
| 查看次数： |
7713 次 |
| 最近记录： |