Question

我想在弹出窗口中自定义term of use，当用户第一次登录时，该页面应该出现在弹出窗口中。

Answer 1

要设置使用条款，您需要做两件事。

首先，您需要创建一个Web内容文章。

转到“控制面板”。
选择“网页内容”。
然后添加＆gt; “基本内容”。
输入您所需的使用条款语言。
记下您创建内容的ID和组ID。

注意：当您查看内容的页面时，ID可用，但组ID不太明显。要查找组ID，请查看URL，然后找到参数doAsGroupId。它的值是您为该文章创建的组ID。

其次，您需要配置门户网站以加载此Web内容文章。

从文件系统导航到Liferay Portal安装。
从那里找到portal.properties文件。如果您使用的是Tomcat，它将位于webapps\ROOT\WEB-INF\classes。
此处添加名为portlet-ext.properties的文件（如果该文件尚不存在）。

使用您之前记下的值添加以下键。

terms.of.use.journal.article.group.id=
terms.of.use.journal.article.id=

重新启动您的服务器，门户现在应该在Web内容文章中显示使用条款。

Answer 2

使用bootstrap模式和javascript进行弹出

JavaScript代码：（在脚本代码中编写此代码）

LdrpRelocateImage

HTML代码：（确保 Javascript代码和 HTML代码应位于同一标签中）

$('#myModal').on('shown.bs.modal', function () {  
  $('#myInput').focus()
})

您可以使用链接代替按钮。

请务必添加 role =＆＃34;对话框＆＃34; 和 aria-labelledby =＆＃34; ...＆＃34; ，引用模态标题， .modal ， role =＆＃34; document＆＃ 34; 到 .modal-dialog 本身。

此外，您可以在 .modal 上使用 aria-describedby 来描述您的模态对话框。

Answer 3

你可以在bootstrap中使用模态对话框，通过它你可以达到你想要的效果。

$(window).load(function()
{
$('#newModal').modal('show');
});

不要忘记在html文件中添加此样式表导入。

<link rel="stylesheet"href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">    </script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

您的html文件应具有以下代码

<div class="container">
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">

  <!-- Modal content-->
 <div class="modal-content">
    <div class="modal-header">
      <!Your Heading-->
    </div>
  <div class="modal-body">
      <p>Your text in the modal.</p>
  </div>
  <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">I Agree</button>
   </div>

Answer 4

简单地去

How to generate a simple popup using jQuery

或

https://jqueryui.com/dialog/

为您的解决方案

或

样式表

    a.selected {
  background-color:#1F75CC;
  color:white;
  z-index:100;
}

.messagepop {
  background-color:#FFFFFF;
  border:1px solid #999999;
  cursor:default;
  display:none;
  margin-top: 15px;
  position:absolute;
  text-align:left;
  width:394px;
  z-index:50;
  padding: 25px 25px 20px;
}

label {
  display: block;
  margin-bottom: 3px;
  padding-left: 15px;
  text-indent: -15px;
}

.messagepop p, .messagepop.div {
  border-bottom: 1px solid #EFEFEF;
  margin: 8px 0;
  padding-bottom: 8px;
}

JAVASCRIPT

   function deselect(e) {
      $('.pop').slideFadeToggle(function() {
        e.removeClass('selected');
      });    
    }

$(function() {
  $('#contact').on('click', function() {
    if($(this).hasClass('selected')) {
      deselect($(this));               
    } else {
      $(this).addClass('selected');
      $('.pop').slideFadeToggle();
    }
    return false;
  });

  $('.close').on('click', function() {
    deselect($('#contact'));
    return false;
  });
});

$.fn.slideFadeToggle = function(easing, callback) {
  return this.animate({ opacity: 'toggle', height: 'toggle' }, 'fast', easing, callback);
};

HTML

<div class="messagepop pop">
    <form method="post" id="new_message" action="/messages">
        <p><label for="email">Your email or name</label><input type="text" size="30" name="email" id="email" /></p>
        <p><label for="body">Message</label><textarea rows="6" name="body" id="body" cols="35"></textarea></p>
        <p><input type="submit" value="Send Message" name="commit" id="message_submit"/> or <a class="close" href="/">Cancel</a></p>
    </form>
</div>

Answer 5

答案在这里，我们需要挂钩

的登录后操作

https://web.liferay.com/community/forums/-/message_boards/message/76286279

如何使用＆＃34;使用条款＆＃34;在Popup中

5 个答案: